在網頁設計中，圖片的布局是至關重要的。通過CSS，我們可以輕松地控制圖片的大小、位置和間距，從而創建一個吸引人的網頁。以下是如何使用CSS實現圖片布局的一些技巧。

//設置圖片的大小
img {
width: 100%;
height: auto;
}
//設置圖片的間距
img + img {
margin-top: 20px;
}
//設置圖片的位置
img.left {
float: left;
margin-right: 20px;
}
img.right {
float: right;
margin-left: 20px;
}
//應用上述CSS
<img src="image.jpg" class="left" alt="image">
<img src="image2.jpg" class="right" alt="image2">

在這個例子中，我們使用了CSS來設置圖片的大小、位置和間距。首先，我們使用width: 100%和height: auto來確保圖片自適應其容器。接下來，我們使用margin-top來設置相鄰圖片之間的間距。然后，我們使用float來將圖片左對齊或右對齊，并使用margin-right或margin-left來設置圖片的位置。

最后，我們將應用上述CSS的類名應用到<img>元素中。<img>元素具有一個class屬性，它可以用于定義樣式標識符。通過應用這些樣式標識符，我們可以輕松地控制網頁上的所有圖片。