怎樣讓html中的文字垂直水平居中顯示

方法

首先我們打開自己的電腦，找到已經(jīng)安裝好的Dreamweaver，新建一個(gè)html頁(yè)面，并保存到桌面上。

然后我們?cè)趆tml的編輯窗口，編輯元素，使其中顯示若干文字，我是用的div標(biāo)簽進(jìn)行布局顯示的。

其在瀏覽器中的顯示效果如下圖所示，我們可以很清晰的看到，文字明顯的靠上靠左對(duì)齊。

接下來(lái)我們就需要為文字元素添加一定的對(duì)齊方式，首先我們讓其居中對(duì)齊，即使用text-align:center。

使用之后在瀏覽器中進(jìn)行效果查看，可以很清楚的看到，文字相對(duì)于之前靠右對(duì)齊了。

我們可以從上一個(gè)圖中看到，文字在垂直方向上還是不對(duì)齊的，接下來(lái)我們就需要為文字添加垂直對(duì)齊樣式，line-height，我們需要將這一樣式的大小設(shè)為文字外層元素的高度大小，這樣便可正好垂直居中對(duì)齊了。

接下來(lái)我們刷新瀏覽器中的頁(yè)面，查看效果，現(xiàn)在的文字已是垂直水平均居中的狀態(tài)。

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com