首頁 > web前端 > css教學 > 如何使用 Bootstrap 對齊表格中的文字?

如何使用 Bootstrap 對齊表格中的文字?

Patricia Arquette
發布: 2024-11-01 12:01:02
原創
912 人瀏覽過

How do I align text in tables using Bootstrap?

Bootstrap 中的文字對齊類別

在 Bootstrap 中,有各種文字對齊類別可用於對齊表格內的文字。

引導程式3

  • text-left:將文字左對齊。
  • text-center:將文字水平置中。
  • text-right:將文字對齊右邊。
  • text-justify:在整個文字中對齊文字寬度。
  • text-nowrap:防止文字換行。

範例:

<code class="html"><th class="text-right">Total</th>
<td>,000,000.00</td></code>
登入後複製

Bootstrap 4

與Bootstrap 3 類似,Bootstrap 4 也提供了文字功能對齊:

  • text-xs-left:在所有視口尺寸上左對齊文字。
  • text-xs-center:在所有視口尺寸上將文字置中。
  • text-xs-right:在所有視口尺寸上右對齊文字。
  • 此外, text-sm-left、text-md-left、text-lg-left 和text-xl-left 指定特定視口大小的左對齊(例如,sm 表示小,md 表示中等) 。

Bootstrap 5

在 Bootstrap 5 中,text-left 已替換為text-start 和 text-right 已替換為 text-end。否則,文字對齊類別保持不變。

以上是如何使用 Bootstrap 對齊表格中的文字?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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