小编Tri*_*mer的帖子

我正在寻找一种在Bootstrap 3中以响应式布局交替行颜色的方法.我无法弄清楚如何在没有大量混乱的CSS的情况下做到这一点,并且希望有人有更好的解决方案.

这是一个简单的前提:12个div在大屏幕上显示为4行3,在小屏幕上显示6行2,在移动设备上显示12行1.无论屏幕大小如何,行都需要具有交替的背景颜色.

Bootstrap 3的HTML如下:

<div class="container">
    <div class="row">
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-01</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-02</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-03</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-04</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-05</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-06</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-07</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-08</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-09</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-10</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-11</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-12</div>
    </div>
</div>

任何想法/提示/帮助将不胜感激.

我想让Navbar背景颜色与折叠菜单的背景颜色不同.