CSS樣式圖片居中對齊是一個常見的需求，尤其是在設計響應式網頁時。下面將詳細介紹如何實現圖片的居中對齊。
在HTML中，插入圖片的代碼通常為

<img src="image.jpg" />

要讓圖片居中對齊，可以使用CSS中的text-align屬性。
首先，在CSS中給圖片所在的div設置寬度，并將text-align屬性設置為center。

p {
width:300px;
text-align:center;
}

然后，使用CSS中的display屬性將圖片轉換為塊級元素。

img {
display:block;
}

最后，將圖片的寬度設置為實際大小，并設置margin屬性為auto，實現水平居中對齊。

img {
width:200px;
margin:auto;
}

完整的代碼如下所示：

<style>
p {
width:300px;
text-align:center;
}
img {
display:block;
width:200px;
margin:auto;
}
</style>
<p>
<img src="image.jpg" />
</p>

通過以上代碼，我們可以實現圖片在div中的居中對齊。同時，也可以通過調整寬度和高度的值，實現不同大小圖片的居中對齊。
以上就是CSS樣式圖片居中對齊的詳細介紹，希望對大家有所幫助。