HTML網(wǎng)頁(yè)中的居中效果是制作網(wǎng)頁(yè)時(shí)必不可少的一種效果。HTML可以通過(guò)不同的方式來(lái)實(shí)現(xiàn)居中效果,在此我們介紹兩種常見(jiàn)的方法。
方法一:使用CSS樣式
使用CSS樣式可以使網(wǎng)頁(yè)元素實(shí)現(xiàn)居中效果,具體代碼如下:
.center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
其中,position: absolute;
使元素脫離常規(guī)流,left:50%;
和top:50%;
用于將元素定位在頁(yè)面的中心,transform:translate(-50%, -50%);
用于將元素的中心點(diǎn)移動(dòng)至實(shí)際的中心點(diǎn)上。
方法二:使用HTML標(biāo)簽
除了使用CSS樣式外,還可以使用HTML標(biāo)簽來(lái)實(shí)現(xiàn)居中效果,具體代碼如下:
<div class="container"> <center> <p>這是居中的文字</p> </center> </div>
通過(guò)在一個(gè)包圍元素中使用<center>
標(biāo)簽,將包圍元素中的元素居中,從而實(shí)現(xiàn)居中效果。