HTML與CSS的***結(jié)合，可以創(chuàng)造出許多令人驚嘆的網(wǎng)頁效果，我們將探討如何在HTML中使用CSS來使圖片居中顯示。

在HTML中，我們可以使用<img>標(biāo)簽來插入圖片，為了讓圖片居中顯示，我們需要使用CSS的margin屬性來設(shè)置圖片的外邊距，我們可以將margin屬性設(shè)置為auto，這樣瀏覽器就會自動計算并設(shè)置圖片的外邊距，使其水平居中顯示。

假設(shè)我們有一個名為example.jpg的圖片，我們可以使用以下HTML和CSS代碼來使其居中顯示：

<img id="example" src="example.jpg" />

#example {
  margin: auto;
  display: block;
}

在上面的代碼中，我們首先使用<img>標(biāo)簽插入圖片，并設(shè)置其ID為example，在CSS中，我們使用#example選擇器來選中該圖片，并設(shè)置其margin屬性為auto，同時設(shè)置display屬性為block，以確保圖片能夠水平居中顯示。

需要注意的是，如果圖片本身具有寬度和高度，那么它們將不會被自動縮放以適應(yīng)容器，如果需要調(diào)整圖片的大小以適應(yīng)容器，可以使用CSS的width和height屬性來設(shè)置圖片的寬度和高度。

使用CSS的margin屬性可以使HTML中的圖片居中顯示，從而創(chuàng)造出更加吸引人的網(wǎng)頁效果。