首頁 > web前端 > css教學 > 主體

如何對齊 Bootstrap 表中的文字?

Susan Sarandon
發布: 2024-10-30 13:40:02
原創
357 人瀏覽過

How to Align Text in Bootstrap Tables?

Bootstrap 中表格元素的文字對齊類別

是否需要將表格內的文字(例如財務數字)右對齊? Bootstrap 提供了一些類別來輕鬆處理此任務。

Bootstrap 3

要在 Bootstrap 3 中右對齊文本,請使用「text-right」類別。

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

Bootstrap 4

在Bootstrap 4 中,使用"text-{breakpoint}-{alignment}":

<code class="html"><p class="text-xs-left">Left-aligned on all viewports</p>
<p class="text-lg-right">Right-aligned on large and wider viewports</p></code>
登入後複製

Bootstrap 5

Bootstrap 5 引入了「text-start」和「text-end」:
<code class="html"><p class="text-start">Left-aligned text</p>
<p class="text-end">Right-aligned text</p></code>
登入後複製

這些類別為表格內的文字對齊提供了靈活性,使您可以輕鬆控制簡報您的資料。

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

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!