使用bootstrap将容器放入容器中?

时间:2017-07-26 10:53:29

标签: twitter-bootstrap

这似乎工作得很好 - 但我想知道这样做是否可行?

为什么我这样做?原因是因为我想要一个整页宽度的背景颜色但是我希望内容在填充容器中。

我做的代码有效 - 我只是想知道它是否有效?

<div class="container-fluid" style="background-color:#F5F5F5;color:#494949;">
    <div class="row">
        <div class="col-sm-12">
            <div class="container">
                <div class="row" style="padding-top:50px;padding-bottom:50px;">
                    <div class="col-sm-8" style="background-color:yellow;">
                        <p>Lorem ipsum...</p>
                    </div>
                    <div class="col-sm-4" style="background-color:pink;">
                        <p>Sed ut perspiciatis...</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

您不应该将容器放在容器内,请阅读引导程序的规则和指南。

你可以这样做https://jsfiddle.net/31kxamL9/

<section style="background-color:#F5F5F5; color:#494949;">
  <div class="container">
    <div class="row" style="padding-top:50px;padding-bottom:50px;">
      <div class="col-sm-8" style="background-color:yellow;">
        <p>Lorem ipsum...</p>
      </div>
      <div class="col-sm-4" style="background-color:pink;">
        <p>Sed ut perspiciatis...</p>
      </div>
    </div>
  </div>
</section>