CSS 圖片如何水平居中 在網(wǎng)頁開發(fā)中，我們經(jīng)常需要在頁面中插入圖片。而有時(shí)候，這些圖片會(huì)顯得不夠美觀，需要對(duì)其進(jìn)行居中處理。那么如何使用 CSS 讓圖片水平居中呢？ 方法一：使用 text-align 屬性 我們可以在 CSS 中使用text-align屬性將圖片水平居中。具體代碼如下：

p {
text-align: center;
}

這個(gè)方法非常簡單，只需要將包含圖片的標(biāo)簽嵌套在p標(biāo)簽中即可。 方法二：使用 margin 屬性 我們也可以使用margin屬性來實(shí)現(xiàn)圖片水平居中。具體代碼如下：

img {
display: block;
margin: 0 auto;
}

在這個(gè)代碼中，我們使用了 display:block 屬性來將圖片轉(zhuǎn)變?yōu)閴K級(jí)元素，這樣才能通過margin屬性來對(duì)其進(jìn)行居中處理。 方法三：使用 flexbox 布局 在新一代瀏覽器中，我們還可以使用 flexbox 布局來實(shí)現(xiàn)圖片的居中處理。具體代碼如下：

p {
display: flex;
justify-content: center;
}

在這個(gè)代碼中，我們使用了 display:flex 屬性來指定了一個(gè) flex 容器，通過設(shè)置justify-content:center屬性來實(shí)現(xiàn)居中處理。 總結(jié) 以上就是三種讓 CSS 圖片水平居中的方法。我們可以根據(jù)具體的需求選擇適合自己的方法。需要注意的是，不同的方法適用于不同的 HTML 結(jié)構(gòu)，需要靈活使用。