css – 使用Bootstrap中的表格行着色

前端之家收集整理的这篇文章主要介绍了css – 使用Bootstrap中的表格行着色前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Twitter Bootstrap提供课程到 color table rows喜欢:
<tr class="success">

我喜欢颜色选择和类命名。现在我想做的是重新使用这些类,并将它们应用在表单元格上。显然,我可以用相同的颜色来定义我自己的类,并用它完成。

但是CSS有一个缩写。 LESS,让td继承类?

解决方法

您可以使用以下方式覆盖默认的css规则:
.table tbody tr > td.success {
  background-color: #dff0d8 !important;
}

.table tbody tr > td.error {
  background-color: #f2dede !important;
}

.table tbody tr > td.warning {
  background-color: #fcf8e3 !important;
}

.table tbody tr > td.info {
  background-color: #d9edf7 !important;
}

.table-hover tbody tr:hover > td.success {
  background-color: #d0e9c6 !important;
}

.table-hover tbody tr:hover > td.error {
  background-color: #ebcccc !important;
}

.table-hover tbody tr:hover > td.warning {
  background-color: #faf2cc !important;
}

.table-hover tbody tr:hover > td.info {
  background-color: #c4e3f3 !important;
}

!重要的是需要,因为引导实际上单独地对单元格进行颜色(afaik不可能仅仅将背景颜色应用于tr)。我的版本的bootstrap中找不到任何颜色变量,但这是基本的想法。

猜你在找的CSS相关文章