我想创建交替的100%彩色块。 “理想”情况被示为附件,以及当前情况。
所需设置:
目前:
我的第一个想法是创建一个div类,给它一个背景颜色,并给它100%的宽度。
.block { width: 100%; background: #fff; }
然而,你可以看到,这显然不工作。它局限于一个集装箱区域。我试图关闭容器,也没有工作。
解决方法
容器类有意不是100%宽度。它是不同的固定宽度,取决于视口的宽度。
如果要使用屏幕的全宽,请使用.container-fluid:
引导3:
<body> <div class="container-fluid"> <div class="row"> <div class="col-lg-6"></div> <div class="col-lg-6"></div> </div> <div class="row"> <div class="col-lg-8"></div> <div class="col-lg-4"></div> </div> <div class="row"> <div class="col-lg-12"></div> </div> </div> </body>
引导2:
<body> <div class="row"> <div class="span6"></div> <div class="span6"></div> </div> <div class="row"> <div class="span8"></div> <div class="span4"></div> </div> <div class="row"> <div class="span12"></div> </div> </body>