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

我們製作網頁時經常會發現，有些時候文字無法居中顯示，那麼我們應該怎樣讓其正好在父級元素的正中央顯示呢？接下來，讓我們一起來了解一下讓html中的文字垂直水平居中顯示的方法吧！

方法

首先我們打開自己的電腦，找到已經安裝好的Dreamweaver，新建一個html頁面，並保存到桌面上。

然後我們在html的編輯窗口，編輯元素，使其中顯示若干文字，我是用的div標籤進行佈局顯示的。

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

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

使用之後在瀏覽器中進行效果查看，可以很清楚的看到，文字相對於之前靠右對齊了。

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

接下來我們刷新瀏覽器中的頁面，查看效果，現在的文字已是垂直水平均居中的狀態。