首页 > web前端 > css教程 > 正文

如何对齐 Bootstrap 表中的文本?

Susan Sarandon
发布: 2024-10-30 13:40:02
原创
431 人浏览过

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
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板