如何使用固定网格蓝图在CSS设计中显示100%宽度的条带？

Question

不确定标题是否真的描述了我想要做的事情.实际上,这在互联网上非常简单和广泛使用:

我想要在背景中一些液体/全宽条纹(与设计的某些div的高度相同),而我的内容是使用蓝图固定网格.

例如,这个网站:intient.com正在做我正在寻找的东西.黑色背景条纹(另一个灰色)是液体宽度,内容使用网格(但在查看CSS后不是蓝图)

我正在使用Blueprint固定宽度网格(950px)来显示任何内容.你知道我怎么做吗？蓝图？没有静态背景图像......

谢谢

Answer 1

在Blueprint中,您执行此操作:

<div class="stripeContainer">
   <div class="container">
     <div class="span-8">Column 1</div>
     <div class="span-8">Column 2</div>
     <div class="span-8 last">Column 3</div>
   </div>
</div>
<div class="container">
  <div class="span-12">Body goes here</div>
  <div class="span-12 last">Some sort of menu perhaps</div>
</div>

然后你风格.stripeContainer:

.stripeContainer
{
    width: 100%; /* this is usually implied */
    background-color: pink;
}