HTML5代碼明星照片墻是一種常見(jiàn)的網(wǎng)頁(yè)設(shè)計(jì)元素，常用于展示明星、藝人等名人的照片。下面是一個(gè)帶有注釋的HTML5代碼實(shí)例：
<!DOCTYPE html>
<html>
<head>
<title>明星照片墻</title>
<style>
/* 樣式表 */
.photo {
width: 200px;
height: 200px;
margin: 10px;
border: 5px solid #fff;
border-radius: 50%;
box-shadow: 1px 3px 5px #888;
transition: transform .3s ease-in-out;
}
.photo:hover {
transform: scale(1.1);
}
</style>
</head>
<body>
<h1>明星照片墻</h1>
<p>以下是一些明星的照片：</p>
<div>
<img class="photo" src="photo1.jpg" alt="明星1">
<img class="photo" src="photo2.jpg" alt="明星2">
<img class="photo" src="photo3.jpg" alt="明星3">
<img class="photo" src="photo4.jpg" alt="明星4">
<img class="photo" src="photo5.jpg" alt="明星5">
</div>
</body>
</html>代碼中，首先聲明了HTML5文檔類型，并在<head>標(biāo)簽中設(shè)置了網(wǎng)頁(yè)標(biāo)題和CSS樣式表。CSS樣式規(guī)定了.photo類的元素指定了照片的寬度、高度、外邊距、邊框、邊框圓角、陰影和鼠標(biāo)懸停效果。
在<body>標(biāo)簽中，將一組照片包裝在一個(gè)<div>標(biāo)簽中，并為每個(gè)照片添加了class="photo"屬性。這個(gè)屬性與CSS樣式表中的.photo類匹配，使每個(gè)照片元素都具有相同的樣式和效果。
除了照片元素外，還可以添加其他元素，如標(biāo)題和段落，以提高網(wǎng)頁(yè)的可讀性和易用性。
上一篇html5代碼教程