基本表格

基础示例

对于基本样式轻填充,只有水平分隔符添加基类 .table 对任何 <table>.

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 默笙 15500000000 @ms

反转表格

你也可以在暗背景下用浅文本反转颜色。 .table-dark.

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 默笙 15500000000 @ms

表头选项

使用两个修饰符类中的一个来制作 <thead>呈浅灰色或深灰色。

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 默笙 15500000000 @ms

条纹行

使用 .table-striped 在任何表格行中添加斑马线<tbody>.

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 默笙 15500000000 @ms

加边表

添加 .table-bordered 在表格的的clss上。

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 Mosheng tecms.net @ms

可折叠行

通过 .table 包装任何形式创建响应表 .table-responsive 使它们在小设备(768 px)下水平滚动。

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 Mosheng tecms.net @ms

小表格

添加属性 .table-sm 通过将填充一半,使表更紧凑。

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 暂未获取到用户数据 @ms
4 默笙 15500000000 @ms
5 默笙 15500000000 @ms
6 默笙 15500000000 @ms
7 默笙 15500000000 @ms
8 默笙 15500000000 @ms
9 默笙 15500000000 @ms

上下类

使用上下类来对表行或单个单元格进行着色。

# 姓名 手机号 用户名
1 默笙 15500000000 @ms
2 默笙 15500000000 @ms
3 默笙 15500000000 @ms
4 默笙 15500000000 @ms
5 默笙 15500000000 @ms
6 默笙 15500000000 @ms
7 默笙 15500000000 @ms
8 默笙 15500000000 @ms
9 默笙 15500000000 @ms