當前位置:吉日网官网 - 錢幣收藏 - 如何使CSS居中

如何使CSS居中

1.首先,在頁面上加載壹張圖片。代碼和效果如下圖所示:

2,然後給圖片設置壹個類名,方便壹會。

3.然後設置圖片的css樣式,為了方便直接把css樣式寫在html頁面上。

4.“margin: 0 auto”常用於實現水平居中,但壹直認為“margin: auto”不能實現垂直居中,但實際上只需增加壹些限制條件,即通過定位就能達到效果:

位置:絕對;

top:0;

左:0;

底部:0;

右:0;

設置位置,使頂部、底部、左側和右側都為0,然後通過邊距將元素居中:0 auto。

5.設置好CSS樣式後,只要瀏覽壹下代碼的效果,就可以看到圖片已經實現了。

6.最後,我附上所有的代碼給妳:

& lt!DOCTYPE html & gt

& lthtml & gt

& lthead & gt

& ltmeta charset = " utf-8 "/& gt;

& lttitle & gt使用CSS將圖片水平和垂直居中

& lt/head & gt;

& ltbody & gt

& ltimg class = " pic " src = " img/timg . jpg " alt = " "/& gt;

& lt/body & gt;

& ltstyle type="text/css " >

。圖片{

邊距:自動;

位置:絕對;

top:0;

左:0;

底部:0;

右:0;

}

& lt/style & gt;

& lt/html & gt;

  • 上一篇:古吳繡皇的簡介
  • 下一篇:衛生間的臉盆如何保養
  • copyright 2024吉日网官网