什么是使这种布局高度增长的最佳方法

Question

请查看此网站布局图片：

layout http://s11.postimage.org/63jd25jzn/Home.jpg

我想让高度随着内容的高度而增长。我想到的唯一方法是通过jquery更改div的高度来完成设计。我正在寻找这种布局的最佳解决方案

Answer 1

不确定什么是黑色“盒子”和蓝色色带，所以我认为它们是某种头。但无论如何，我希望你能得到这个想法，你将能够根据自己的需要修改我的代码。

<div id="header" class="green">
    <!-- Green section, header of the page -->
</div>
<div id="content" class="red">
    <!-- This #content div should have the red zone as a background -->
    <div class="content-header yellow">
        <!-- Yellow section, header of the content -->
    </div>
    <div class="content-body">
        <p>Your content</p>
    </div>
</div>
<div id="footer" class="purple">

</div>

#content div应该将红色部分作为背景，一个可以垂直重复的薄图案。

我认为.content-header div是标题，它应该以黄色部分为背景。

但基本上，这个想法是有一个标题（绿色），一个背景可以垂直重复的内容区域（红色）和一个页脚（紫色）。