CSS圖片自適應布局是一種常見的網頁布局方式，可以讓網頁在不同設備上適應不同的屏幕大小。在實現圖片自適應布局時，需要使用一些CSS樣式。

/* 設置圖片為自適應 */
img {
max-width: 100%;
height: auto;
}
/* 在包裹圖片的容器中設置寬度 */
.container {
width: 80%;
margin: auto;
}

在上面的代碼中，我們通過設置標簽的max-width屬性為100%，這樣圖片就可以隨著容器寬度的改變而自動縮放。同時，如果圖片的高度和寬度不成比例，我們可以設置height屬性為auto，這樣圖片就不會被拉伸或壓縮。

而為了讓圖片能夠被包含在一個容器中，我們需要設置該容器的寬度和居中對齊，這樣圖片就不會隨著瀏覽器窗口大小的改變而失去布局?？梢允褂胢argin來將容器水平居中，同時設置寬度為一個百分比，這樣容器也會隨著瀏覽器窗口大小的改變而縮放。

<div class="container"><img src="image.jpg" alt="圖片"></div>

最后，在HTML中將圖片包含在一個容器中，這樣就可以使用上面我們提到的CSS樣式來達到圖片自適應布局的效果。