css裡面div如何居中顯示文字-css教學-PHP中文網

css裡面div如何居中顯示文字

藏色散人

發布： 2022-12-30 11:13:50

原創

7525 人瀏覽過

css裡面div居中顯示文字的實作方法：先建立一個HTML範例檔；然後在body中加入div文字；最後透過為文字所在div添加「text-align:center」樣式來設定div中文字居中即可。

css裡面div如何居中顯示文字

本文操作環境：Windows7系統、HTML5&&CSS3、Dell G3電腦。

可以透過為文字所在div新增text-align:center樣式來設定div中文字居中。

text-align 屬性規定元素中的文字的水平對齊方式。

此屬性透過指定行框與哪個點對齊，從而設定區塊級元素內文字的水平對齊方式。透過允許使用者代理程式調整行內容中字母和字之間的間隔，可以支援值 justify；不同使用者代理程式可能會得到不同的結果。

屬性值：

left 把文字排列到左邊。預設值：由瀏覽器決定。
right 把文字排列到右邊。
center 把文字排列到中間。
justify 實作兩端對齊文字效果。
inherit 規定應該從父元素繼承 text-align 屬性的值。

推薦：《css影片教學》

#範例：

<html>
<head>
<style type="text/css">
div  {
width: 200px;
border: 1px solid red;
text-align: center;
}
</style>
</head>
<body>
    <div>
示例文字
        </div>
</body>
</html>

登入後複製

效果如下：

css裡面div如何居中顯示文字

以上是css裡面div如何居中顯示文字的詳細內容。更多資訊請關注PHP中文網其他相關文章！

php8，我來也

30分鐘學會網站佈局

尚觀Oracle入門到精通視頻教程

你的第一行UNI-APP程式碼

Flutter 從頭到應用程式啟動

兄弟連新版Linux視頻教程

AXURE 9影片教學（適用於產品經理互動產品設計UI）

零基礎PS影片教學

16天帶你入門UI視頻教程

PS技巧和切片技巧影片教學

阿裡雲環境搭建以及項目上線視頻教程

電腦網路概述－程式設計師必須掌握的基礎知識

程式設計師必備教學——HTTP協定講解

Websocket影片教學

css裡面div如何居中顯示文字