这个该如何告诉你呢? 只能说是常见现象。 假如我们有三个 div ,分别对应 header、contant、footer 代码结构: HTML: <div id="header"></div> <div id="contant"></div> <div id="footer"></div> 现在将中间的分成左右两列,除非 contant 的高度你明确定义了,否则就会出现 contant 覆盖 footer 的现象,那么我们必须增加一点东西。 HTML: <div id="header"></div> <div id="contant"> <div id="mainContent"></div> <div id="sideBar"></div> <div class="clearBoth"></div> </div> <div id="footer"></div> 例如上面的代码,本来 contant 中我们只要左边的 mainContent 和右边的 sideBar 就可以了,但是我们还要增加一个类为 clearBoth 的 DIV。 clearBoth 类的定义如下: HTML: .clearBoth { clear: both; } 就是 clear: both; 在起作用。 这里有一些不错的范例,而且你可以根据布局结构搜索: http://tools.i-use.it/ (英文) 这里也有关于经典三列布局的讨论: http://joshuaink.com/blog/196/a-simple-guide-to-3-column-layouts (英文)