CS6 流体网格 3 种背景 100% 宽？

Question

我是流体网格的新手，顺便说一句，我已经开始学习不同的类型，现在尝试在 cs6 中构建页面（也许不是正确的选择）。我在构建不流畅的页面时遇到了一个问题。我需要为页眉和页脚创建不同的背景图像，它们的宽度为 100%，与屏幕一样宽，而不仅仅是与媒体查询一样宽，并且还需要将页面设置为 960 居中。

Answer 1

您是否想让页眉比页面的其余部分更宽？ 为此，请在文档中创建不同的 div。例如，我通常在主 div 中工作所有 div，因此我的整个页面都会受到影响。例如，具有主 div、页眉、正文和页脚的页面： #main#header#body#footer。页眉、正文和页脚都在主 div 内创建。要使所有内容以 960 像素的宽度浮动在页面中心，您只需将属性应用于 #main div，如下所示：

#main {
    width: 960px;
    margin: 0;
}

边距会使 div 浮动在中心。它不必是任何特定值，但您确实需要页面左右两侧的边距。

要仅浮动页面的其余部分，请在主 div 内创建除页眉和页脚之外的所有其他内容，并将页眉的宽度设置为 100%。所以你会有以下整体sn-p：

#header, #footer{
    width: 100%;
    margin: 0;
}
#main {
    width: 960px;
    margin: 0;
}

如果您还没有这样做，明智的做法是在两侧添加一些内边距，这样图像和文字就不会出现在页面的一侧（这使得阅读或看法）。我通常只添加 5px。