HTML中如何將圖片設(shè)置為居中顯示呢?以下是一些方法:
/* 方法一 */ <div style="text-align:center;"> <img src="your-image-url.jpg" alt="your-image-description"> </div> /* 方法二 */ <img style="display:block; margin:auto;" src="your-image-url.jpg" alt="your-image-description">
方法一解釋:
我們使用了一個(gè) div 標(biāo)簽來裝載我們的圖像。div標(biāo)簽中的樣式“text-align: center;”將元素的文本居中對(duì)齊。在我們的情況下,圖像也是一個(gè)元素。因此,這個(gè)屬性使圖像在元素中心對(duì)齊。
方法二解釋:
我們?cè)?img 標(biāo)簽中使用了樣式“display:block; margin:auto;”。這種方法使用了 margin 屬性。正數(shù)的值給其指定了將元素與周圍元素或父元素之間的距離,而將長度設(shè)置為“auto”會(huì)自動(dòng)表示該元素周圍的相同余量。