html - 为什么背景色对我不起作用？

我正在通过Free Code Camp进行尝试，并尝试设置投资组合类型页面。在“关于我”部分下有一个称为“内容”部分的div。不管我做什么，我都无法为其添加背景色。我试过内联，添加一个id，并添加一个类，但它不会改变。有什么建议么？
    
      
        
      

  <!--Navbar-->
      <nav class="navbar navbar-default">
        <div class="container-fluid">
          <div class="navbar-header">
            <ul class="nav navbar-nav">
              <li><a href="#">Home</a></li>
              <li><a href="#">About Me</a></li>
              <li><a href="#">Porfolio</a></li>
              <li><a href="#">Contact Me</a></li>
            </ul>
          </div>
        </div>
      </nav>
<!--hero-->
  <div class="jumbotron" id="hero">
    <h1>Personal Portfolio</h1>
  </div>
<!--About Me-->
  <div class="content-section" style="background-color:red;">
    <div class="col-md-6">
      <h1>Tyler Jensen</h1>
      <p>I am starting to work on my front end skills.</p>
    </div>
    <div class="col-md-6">
      <img class=
"img-thumbnail" src="1969391_10202992168661853_8988955640237620329_n.jpg">
    </div>
  </div>
<!--Portfolio-->
  <div class="content-section">
    <div class="col-md-3"><img src="/Hausbarn.jpg" width="200px" alt="german hausbarn"></div>
    <div class="col-md-3"><img src="/CuppUC.jpg" width="200px" height="133px" alt="cupp insurance"></div>
    <div class="col-md-3"><img src="/BackflowPipe.jpg" width="200px" height="133px" alt="cupp insurance"></div>
    <div class="col-md-3"><img src="/carrier1.jpg" width="200px" height="133px" alt="cupp insurance"></div>
  </div>
<!--Footer-->
    <footer class="footer">
      <div class="content-section">
        <div class="col-md-4 text-center">
          <ul style="display: inline-block">
           <li><a href="#">Home</a></li>
           <li><a href="#">About Me</a></li>
           <li><a href="#">Porfolio</a></li>
           <li><a href="#">Contact Me</a></li>
         </div>
         <div class="col-md-4 text-center">1234 Street<br>Chicago, Il </div>
         <div class="col-md-4 text-center"><img src="" width="200px"></div>
        </div>
    </footer>
</body>

最佳答案

将clearfix类添加到具有背景颜色的类中：
http://getbootstrap.com/css/#helper-classes-clearfix

它与块格式化上下文有关：How does the CSS Block Formatting Context work?

当您有一个内部元素浮动的容器（<div）（在您的情况下为列）时，父级折叠到0高度（因此背景在那里，但看不到）。有多种解决方法，其中一种是clearfix解决方案。有时我只是将父级设置为overflow:hidden来解决此问题。

关于clearfix的更多信息：What is a clearfix?

关于html - 为什么背景色对我不起作用？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/37172418/