Question

CSS非常糟糕，我试图通过学习如何使用bootstrap让我的生活更轻松，但我不明白为什么我在.css文件中修改的属性不会改变html元素。

在我的HTML文档中，我有

/live

然后在我的.css文件中

<div class="container-fluid">

  <div class="row bot">
    <div class="col-lg-4" style="background-color:lavender;">.col-sm-4</div>
    <div class="col-lg-4" style="background-color:lavenderblush;">.col-sm-4</div>
    <div class="col-lg-4" style="background-color:lavender;">.col-sm-4</div>
  </div>


</div>

但是当我刷新我的html文档时，行的背景颜色不会改变？实际上它没有做任何事情。我做错了什么？

Answer 1

将您的CSS更改为：

.row.bot {
  height: 150px;
  background-color: blue;
}

所以删除两个类之间的空格。

Answer 2

试试这段代码 Html代码：

<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="container-fluid">
<div class="row bot">
<div class="cog-lg-4 col-sm-4 col-xs-12">.col-sm-4</div>
<div class="col-lg-4 col-sm-4 col-xs-12">.col-sm-4</div>
<div class="col-lg-4 col-sm-4 col-xs-12">.col-sm-4</div>
</div>
</div>
</body>
</html>

css代码：

body{
height: 2000px;
}
.bot{
/* height: 150px; */
height:100%;
background-color: blue;
}

JS FIDDLE LINK CLICK HERE

请尝试尽可能避免内联风格。

引导行属性在css中没有变化

2 个答案: