html怎麼讓文字居中

藏色散人
發布: 2023-01-06 11:12:35
原創
36799 人瀏覽過

html讓文字居中的方法:1、給文字所在標籤加上CSS屬性值「text-align:center」;2、在行內標籤或行內區塊級標籤中加CSS屬性值「text-align :left」。

html怎麼讓文字居中

本文操作環境:windows7系統、HTML5&&CSS3版、Dell G3電腦。

兩種情況:1、文字格式居中;2、文字所在標籤居中顯示在視窗中。

1、為文字所在標籤加CSS屬性值"text-align:center"即可。例如:

<p style="text-align:center">我是文本,居中显示</p>
登入後複製

2、有很多種方法,這裡介紹兩種,例如:

1)(建議)文字應該被行內標籤或行內區塊級標籤包裹,行內標籤或行內區塊級標籤又被區塊級標籤包裹。此種方式 文字格式 會居中。若想 文字格式 不居中,可在行內標籤或行內區塊級標籤中加CSS屬性值"text-align:left"或其他。

<div style="text-align:center"> <!-- 块级标签 -->
    <span>我是文本所在标签1,文本居中显示<span> <!-- 行内标签 -->
    <div style="display:inline-block;">我是文本所在标签2,文本居中显示</div> <!-- 行内块级标签 -->
</div>
登入後複製

2)文字被區塊級標籤包裹。為區塊級標籤設定寬度,並加上CSS屬性值" margin:0 auto"。此種方式 文字格式 不會居中。若想 文字格式 也居中,可在區塊級標籤加CSS屬性值"text-align:center"。

<div style="width: 100px; margin:0 auto">我是文本所在标签,文本居中显示</div>
登入後複製

學習影片分享:css影片教學

以上是html怎麼讓文字居中的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板