Question

我有一个2-8-2网格正在进行中。我希望每侧的2个保持白色，而中间的8个网格变为假灰色。

我的尝试：

HTML

<div class = "name"  class="col-sm-8 text-left">

</div>

CSS

.name{
  background-color: #gray; (or any other color) 
}

我的结果是，在div中，每次只有一个类可以工作。要么它会给我整个网格的颜色，要么根据class="name"和class="col-sm-8 textleft"

的顺序它不会给我任何颜色

Answer 1

变化： <div class = "name" class="col-sm-8 text-left" >

成： <div class = "name col-sm-8 text-left" >

如果css和html的其余部分没问题，它应该可以工作。

Answer 2

您的代码存在的问题是您正在复制class属性。而不是

class="name" class="col-sm-8 text-left"

将其更改为

class="col-sm-8 text-left name"

HTML元素只允许一个class属性，这意味着如果存在两个，则会忽略一个;这就是你看到订购问题的原因。

最终代码看起来像这样：

.name {
  background-color: grey;
}

<div class="container">
  <div class="row">
    <div class="col-xs-2 text-center">
      Outer
    </div>
    <div class="col-xs-8 text-center name">
      Inner
    </div>
    <div class="col-xs-2 text-center">
      Outer
    </div>
  </div>
</div>

Bootply Example

如何让div类成为某种颜色，同时保持在某些网格中？

2 个答案: