CSS如何居中圖片對齊呢？下面來一起了解一下。 首先，我們先來看一下HTML代碼：

<div class="container">
	<img src="#"/>
</div>

這是一個容器里面放置了一張圖片的代碼，那么如何讓這張圖片在容器中居中呢？ 我們可以使用CSS的 text-align 屬性來實現它，將容器設為居中即可。看下面這個代碼：

.container {
text-align: center;
}

簡單吧！這樣圖片就能夠在容器中水平居中了。 接下來，我們再來看看其他垂直居中的方法。 第一種是使用CSS3的 transform 屬性和絕對定位來實現，具體代碼如下：

.container {
position: relative;
}
.container img {
position: absolute;
top: 50%;
transform: translateY(-50%);
}

這種方法也比較簡單，首先將容器設為相對定位，再將圖片設為絕對定位，并且將 top 值設為 50% ，再利用 transform: translateY(-50%); 將圖片向上移動50%即可。 第二種是使用 flex 布局，非常適合一些復雜的布局，具體代碼如下：

.container {
display: flex;
align-items: center;
justify-content: center;
}

這種方法利用 flex 布局的屬性實現的，將容器設為 flex 布局，然后使用 align-items 和 justify-content 屬性讓容器內的元素居中。 以上就是關于如何居中圖片對齊的一些方法，希望對大家有所幫助。