html – 如何在Bootstrap 3中更改行的颜色？

我想在Bootstrap 3网格中更改交替行的背景颜色.我以为我可以创建一些CSS并将其添加到div中的类,但颜色不会改变.

这是我的CSS：

.row-buffer {
margin-top:20px;
margin-bottom:20px;
}

.row-even {
background-color:#76A0D3;
}
.row-odd {
background-color:#BDE3FB;
}

我的行被定义如下：

<div class="row row-buffer row-even">

要么：

<div class="row row-buffer row-odd">

行缓冲区工作正常,但行偶数和行奇数似乎没有任何区别？ (我的行是在容器中定义的.)

我吠叫错了树吗？

解决方法

如果没有能够看到你的确切情况,我会猜测你因为选择器特异性而遇到问题.如果bootstrap有一个比.class更具体的选择器,那么你的规则永远不会覆盖它.您需要在选择器中匹配或比引导程序更具体.

通常获得很多特异性的简单方法是为您的选择器添加一个id,如：

#myrows .row-even {
    background-color:#76A0D3;
}
#myrows .row-odd {
    background-color:#BDE3FB;
}

我创建了一个小例子,说明特异性如何导致问题：
http://jsfiddle.net/path411/JyUy2/