在Twitter Bootstrap中居中显示表格中的文本
在Twitter Bootstrap中居中显示表格中的文本
提问于 2012-07-27 05:28:32
由于某些原因，表格中的文本仍然没有居中。为什么？如何在表格中居中显示文本？
说得很清楚:例如，我希望"Lorem“坐在四个"1”的中间。
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
table,
thead,
tr,
tbody,
th,
td {
text-align: center;
}<table class="table">
<thead>
<tr>
<th>1</th>
<th>1</th>
<th>1</th>
<th>1</th>
<th>2</th>
<th>2</th>
<th>2</th>
<th>2</th>
<th>3</th>
<th>3</th>
<th>3</th>
<th>3</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="4">Lorem</td>
<td colspan="4">ipsum</td>
<td colspan="4">dolor</td>
</tr>
</tbody>
</table>
回答 9
Stack Overflow用户
发布于 2014-02-17 22:36:45
在Bootstrap3 (3.0.3)中，向td元素添加"text-center"类可以开箱即用。
即，表格单元格中的以下中心位置some text：
<td class="text-center">some text</td>Stack Overflow用户
发布于 2014-07-30 20:00:26
我认为谁是最好的html和Css的组合，快速和干净的mod是：
<table class="table text-center">
<thead>
<tr>
<th class="text-center">Uno</th>
<th class="text-center">Due</th>
<th class="text-center">Tre</th>
<th class="text-center">Quattro</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</tbody>
</table>关闭<table>初始化标记，然后将其复制到您想要的位置:)我希望它能派上用场，祝您在stackoverflow中过得愉快
附注：Bootstrap v3.2.0
Stack Overflow用户
发布于 2013-06-21 14:14:21
您可以在不更改css的情况下，通过在单元格中添加一个带有"text-center“类的div来使td对齐：
<td>
<div class="text-center">
My centered text
</div>
</td>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11678298
复制相关文章
相似问题