bootstrap表格内容居中
时间: 2023-07-01 13:25:09 浏览: 53
要让 Bootstrap 表格中的内容居中,可以在表格中使用 CSS 居中文本。可以使用以下代码:
```html
<table class="table">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center">1</td>
<td class="text-center">Mark</td>
<td class="text-center">Otto</td>
<td class="text-center">@mdo</td>
</tr>
<tr>
<td class="text-center">2</td>
<td class="text-center">Jacob</td>
<td class="text-center">Thornton</td>
<td class="text-center">@fat</td>
</tr>
<tr>
<td class="text-center">3</td>
<td class="text-center">Larry</td>
<td class="text-center">the Bird</td>
<td class="text-center">@twitter</td>
</tr>
</tbody>
</table>
```
在每个表格单元格中添加`text-center`类可以使内容居中。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![js](https://img-home.csdnimg.cn/images/20210720083646.png)