表格
优质
小牛编辑
130浏览
2023-12-01
表格是一个很好的方法用于处理大量的数据。我们提供了一些实体类来帮助你更简单的表格增加样式。此外,为了提高移动端的体验,所有的表格在手机屏幕的宽度都是自动居中的。
无边框表格
表格默认是无边框的。
<table>
<thead>
<tr>
<th data-field="id">姓名</th>
<th data-field="name">年龄</th>
<th data-field="price">民族</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>17</td>
<td>汉</td>
</tr>
<tr>
<td>李四</td>
<td>12</td>
<td>苗</td>
</tr>
<tr>
<td>李明</td>
<td>25</td>
<td>汉</td>
</tr>
</tbody>
</table>
有边框表格
添加 class="bordered"
table 标签中实现表格的边框。
带条纹的表格
添加 class="striped"
到 table 标签中实现条纹表格。
高亮表格
添加 class="highlight"
table 标签中实现高亮表格。
居中的表格
添加 class="centered"
到 table 标签中实现表格内容居中对齐。
响应式表格
添加 class="responsive-table"
到表格标签中实现响应式表格,当屏幕大小不足以显示表格内容时,将出现水平滚动条。