使用 960.gs 将页眉/页脚 bg 扩展到屏幕边缘答案

【问题标题】：extend header/footer bg to screen edge using 960.gs使用 960.gs 将页眉/页脚 bg 扩展到屏幕边缘
【发布时间】：2011-08-30 19:50:59
【问题描述】：

我正在为一个 drupal 站点使用 960.gs 样式表 - 我想将页眉和页脚部分都扩展到网页的边缘 - 从而产生与堆栈溢出网站完全相同的东西。

【问题讨论】：

标签： css drupal 960.gs

【解决方案1】：

我相信您需要使用没有预定义帮助类的 div，因为默认情况下 div 会扩展到其父级的全宽（如果没有包装器 - 它将是全屏）

一些简单的例子：

<header>
    <nav>
      <ul>
        <li> blarg </li>
      </ul>
    </nav>
</header>

<div id="main" role="main" class="container_12">
    ....
    ....
</div>

<footer>
  <p>Thanks!</p>
</footer>

希望这会有所帮助。

【讨论】：

谢谢，我想我发现 960 框架可能并不最适合我此时的需求。它是关于列的，我特别需要它来延伸到边缘。我想我可以摔跤它，并按照您的建议更改其中一个 960 col 后面的 bg 颜色。这可能会在 intrum 中起作用
我相信您仍然可以使用 960gs 网格系统实现您想要的效果。 jsfiddle.net/4aRWn 这是页眉的一个工作示例，页脚的背景扩展了浏览器的整个宽度，而#main 容器 div 的背景颜色仅扩展了 container_12 div。您可能需要缩小 JS 小提琴以获得完整的解释（或复制代码并在真实页面上使用它）无论如何，我希望这会有所帮助，并希望您可以从这里开始创建您正在寻找的页面制作。