对于基本造型& mdash轻度填充和仅水平分隔& mdash添加基类
。桌子
对任何人
<表格>
。这可能看起来非常多余,但是考虑到表格在其他插件(如日历和日期选择器)中的广泛使用,我们选择隔离我们的自定义表格样式。
# | 西方人名的第一个字 | 姓 | 用户名 |
---|---|---|---|
一 | 标记 | 香精油 | @mdo |
2 | 雅各 | 桑顿(姓氏) | @胖 |
3 | 称量车 | 这只鸟 | @推特 |
使用
。表条纹的
将斑马纹添加到
< tbody >
。
# | 西方人名的第一个字 | 姓 | 用户名 |
---|---|---|---|
一 | 标记 | 香精油 | @mdo |
2 | 雅各 | 桑顿(姓氏) | @胖 |
3 | 称量车 | 这只鸟 | @推特 |
增加
。表格边缘的
表格和单元格各边的边框。
# | 西方人名的第一个字 | 姓 | 用户名 |
---|---|---|---|
一 | 标记 | 香精油 | @mdo |
标记 | 香精油 | @自举 | |
2 | 雅各 | 桑顿(姓氏) | @胖 |
3 | 小鸟拉里 | @推特 |
增加
。表格悬停
中的表行上启用悬停状态
< tbody >
。
# | 西方人名的第一个字 | 姓 | 用户名 |
---|---|---|---|
一 | 标记 | 香精油 | @mdo |
2 | 雅各 | 桑顿(姓氏) | @胖 |
3 | 小鸟拉里 | @推特 |
增加
。表浓缩的
通过将单元格边距减半来使表格更紧凑。
# | 西方人名的第一个字 | 姓 | 用户名 |
---|---|---|---|
一 | 标记 | 香精油 | @mdo |
2 | 雅各 | 桑顿(姓氏) | @胖 |
3 | 小鸟拉里 | @推特 |
使用上下文类为表格行或单个单元格着色。
班级 | 描述 |
---|---|
。活跃的
|
将悬停颜色应用于特定行或单元格 |
。成功
|
表示成功或积极的行动 |
。信息
|
表示中性的信息变化或动作 |
。警告
|
表示可能需要注意的警告 |
。危险
|
表示危险或潜在的负面行为 |
# | 列标题 | 列标题 | 列标题 |
---|---|---|---|
一 | 列内容 | 列内容 | 列内容 |
2 | 列内容 | 列内容 | 列内容 |
3 | 列内容 | 列内容 | 列内容 |
四 | 列内容 | 列内容 | 列内容 |
5 | 列内容 | 列内容 | 列内容 |
6 | 列内容 | 列内容 | 列内容 |
七 | 列内容 | 列内容 | 列内容 |
8 | 列内容 | 列内容 | 列内容 |
9 | 列内容 | 列内容 | 列内容 |
通过包装任何
。桌子
在
。表响应的
使它们水平滚动到小设备(低于768像素)。当查看宽度大于768像素的任何内容时,您将看不到这些表格中的任何差异。
# | 表格标题 | 表格标题 | 表格标题 | 表格标题 | 表格标题 | 表格标题 |
---|---|---|---|---|---|---|
一 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |
2 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |
3 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |
# | 表格标题 | 表格标题 | 表格标题 | 表格标题 | 表格标题 | 表格标题 |
---|---|---|---|---|---|---|
一 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |
2 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |
3 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 | 表格单元格 |