bootstrap: 表格
bootstrap中的table标签同样默认是没有边框的
类名 | 添加位置 | 作用 |
---|---|---|
.table | 给table标签添加 | 作为基类,为其他表格类提供样式(即:每一行上方多了一条水平线,并且表格宽度变为100%) |
.table-striped | 给table标签添加 | 隔行换色,单行为浅灰色背景颜色,双行白色背景颜色 |
.table-bordered | 给table标签添加 | 显示完整的内外边框(即:表格和单元格边框) |
.table-hover | 给table标签添加 | 当鼠标移入表格的时候,对应的行的背景颜色变为深灰色 |
.table-responsive | 给table标签的父级元素添加 | 设置响应式表格(即:表格宽度比屏幕宽时在表格下方出现横向滚动条,这样不用让整个页面滚动) |
.table-condensed | 给table标签添加 | 紧缩表格(即:让单元格的padding值减为原来的一半) |
表格颜色 | ||
.active | 给tr或td标签添加 | 将行或单元格设置为深灰色(和鼠标悬停时一样的颜色) |
.success | 给tr或td标签添加 | 将行或单元格设置为淡绿色 (表示成功或积极的颜色) |
.info | 给tr或td标签添加 | 将行或单元格设置为淡蓝色 (表示普通的提示的颜色) |
.warning | 给tr或td标签添加 | 将行或单元格设置为淡黄色 (表示警告或需要用户注意的颜色) |
.danger | 给tr或td标签添加 | 将行或单元格设置为淡红色 (表示危险或潜在的负面影响的颜色) |