在Twitter的Bootstrap框架中是否有一组对齐文本的类?
例如,我有一些包含$ total的表格,我希望它们向右对齐……
<th class="align-right">Total</th>
and
<td class="align-right">$1,000,000.00</td>
在Twitter的Bootstrap框架中是否有一组对齐文本的类?
例如,我有一些包含$ total的表格,我希望它们向右对齐……
<th class="align-right">Total</th>
and
<td class="align-right">$1,000,000.00</td>
当前回答
使用BootstrapX使用text-right完美工作:
<td class="text-right">
text aligned
</td>
其他回答
<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
Left aligned text on viewports sized MD (medium) or wider.
Left aligned text on viewports sized LG (large) or wider.
Left aligned text on viewports sized XL (extra-large) or wider.
这是最简单的解决办法
你可以像text-center, left或right这样分配类。文本将相应地对齐这些类。不必单独创建类。这些类是BootStrap 3中内置的
<h1 class="text-center"> Heading 1 </h1>
<h1 class="text-left"> Heading 2 </h1>
<h1 class="text-right"> Heading 3 </h1>
检查: 演示
使用text-align:center !重要。可能有其他的文本对齐css规则,所以!important是重要的。
表格 th, td { 颜色:黑色!重要; border-collapse:崩溃; 背景颜色:黄色! 边框:1px纯黑色; 填充:10 px; Text-align: center ! } <表> < tr > < th > 居中对齐文本 < / th > < / tr > < tr > <td>居中对齐文本</td> <td>居中对齐文本</td> < / tr > 表> < /
引导3
v3文本对齐文档
<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
<p class="text-justify">Justified text.</p>
<p class="text-nowrap">No wrap text.</p>
引导4
v4文本对齐文档
<p class="text-xs-left">Left aligned text on all viewport sizes.</p>
<p class="text-xs-center">Center aligned text on all viewport sizes.</p>
<p class="text-xs-right">Right aligned text on all viewport sizes.</p>
<p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>
引导5
v5文本对齐文档
Text-left已被text-start取代, Text-right已被text-end取代
<p class="text-start">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-end">Right aligned text.</p>
<p class="text-justify">Justified text.</p>
<p class="text-nowrap">No wrap text.</p>
使用BootstrapX使用text-right完美工作:
<td class="text-right">
text aligned
</td>