html - 如何包装不同背景的内容？

Question

我刚开始学习网页设计，请看> this images

这里我想将内容包装成 960px 宽度(红框)但我希望每个内容/部分都有不同的背景颜色(仅作为示例)但背景宽度超过包装，或者可能是全宽/100%

我该怎么做？谢谢

编辑:举个例子，做这样的事情的网站是 IMAGESHACK 背景颜色是整个屏幕的宽度，但内容仍然包装到主包装

Answer 1

您需要一个宽度为 960px 的容器:

<div class="lightGray">
    <div class="container" style="width:960px">Content</div>
</div>

<div class="medGray">
    <div class="container" style="width:960px">Content</div>
</div>

<div class="darkGray">
    <div class="container" style="width:960px">Content</div>
</div>

这将允许颜色在整个屏幕上扩展，并随着内容的扩展而扩展。当然，我会偏离内联样式。只需创建一个名为容器的类:

.container {width: 960px;}