Question

Here is a picture of what I want changed to blue

这是我的html和css代码：https://jsbin.com/cofeweqaca/edit?html,css,output

好的，奇怪的事情还在继续。当我创建jsbin以向您显示我的所有问题时，问题就不存在了。所以我的问题以某种方式存在于崇高中。我的问题是：2个灰色div之间的空间（顶部是一个底部不是jumbotron）。应该像jsbin一样是蓝色的。但在我的崇高中，当我在Chrome中打开它时，它的白色。除了两个div之间的小条纹外，其他一切都是蓝色的。我对Web开发人员非常陌生。那么也许比我更聪明的人可以解释这个问题的原因？它为什么是白色的？谢谢！

编辑：这是我的代码。

html {
  font-family: 'Droid Sans', sans-serif;
}
#navb {
  background: #3E474C;
}
#bs-example-navbar-collapse-1 ul li a {
  color: white;
}
li:hover {} html {
  background: #A5BCCC;
}
body {
  background: #A5BCCC;
}
#rankjumbo {
  margin-top: 100px;
  height: 350px;
  margin-bottom: 0;
}
.searchbox {
  width: 50%;
  margin: auto auto;
}
#text {
  text-align: center;
  font-family: 'Droid Sans', sans-serif;
}
#h1 {
  font-family: 'Pacifico', cursive;
  text-align: center;
  padding-bottom: 30px;
}
#button {
  background: #4B7795;
  color: white;
  font-family: 'Droid Sans', sans-serif;
}
.list {
  height: 300px;
  background: #eee;
  margin-top: 30px;
}

<div id="rankjumbo" class="jumbotron">

  <div class="container">

    <div id="special">

      <h1 id="h1">Rank.gg</h1>

      <div class="searchbox">
        <input id="text" class="form-control" type="text" placeholder="Enter your IGN...">
        <button id="button" class="btn btn-default btn-block">See Where You Rank!</button>

      </div>
    </div>


  </div>
</div>

<div class="list">



</div>

Answer 1

因为#rankjumbo内部的高度和空白div类“list”删除了css .list并使你的#rankjumbo像这样Live Fiddle

#rankjumbo{
margin-top:100px;
margin-bottom: 0;

}

Answer 2

我通过在我的html中移动样式表上方的引导链接来修复它。

保证金是白色的。如何将其更改回背景色？

2 个答案: