如何自定义具有相同类名的引导列？答案

【问题标题】：How to customize bootstrap columns with the same class name?如何自定义具有相同类名的引导列？
【发布时间】：2015-11-23 17:20:57
【问题描述】：

我试图在同一行中使用相同的.col-5（用于调整大小），但我不知道更改每个列的背景颜色的最佳方法，因为列是相同的名称（这将改变所有列的样式）。

编辑：我想做的不仅仅是改变背景颜色这么简单 span 标签不是最优的。

处理此问题的最佳做法是什么？假设我链接到引导程序和我自己的自定义 .css 文件：

<body>


    <header>
      <div class="logo"><h1>Name</h1></div>
    </header>



    <div id="sideBar">

    </div>



    <div id="rowContainer1">

      <div class="row">
        <div class="col-5">
          Hello
        </div>
        <div class="col-5">
          Hello
        </div>
      </div>

    </div>



    <div id="rowContainer2">

      <div class="row">
        <div class="col-5">
          Hello
        </div>
        <div class="col-5">
          Hello
        </div>
      </div>

    </div>



  </body>
</html>

【问题讨论】：

添加另一个类，例如
、
等
“我想做的不仅仅是改变背景颜色，所以简单的 span 标签不是最佳选择。”你想让我做什么？你是从数据库循环结果吗？为什么不给每个 col 一个唯一的 ID 和基于此的样式？

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> <div class="row"> <div class="col-5 col-red"> RED </div> <div class="col-5 col-green"> GREEN </div> </div>