CSS想让一个元素的百分比高度height: 100%起作用,需要给这个元素的所有父元素的高度设定一个有效值。如下所示就可以让div高度为100%了:
<html style="height: 100%"><body style="height: 100%">
<div style="height: 100%border: 1px solid #C00">
<p>
这样这个div的高度就会100%了
</p>
</div>
</body>
</html>
在使用height: 100%时需要注意的一些事项
1、Margins 和 padding 会让你的页面出现滚动条,也许这是你不希望的。
2、如果你的元素实际高度大于你设定的百分比高度,那元素的高度会自动扩展。
因为你的top1的宽度是1200px,而你的浏览器在缩小后,整体宽度比1200要窄,浏览器下方是肯定会有横向滚动条的。所以,如果你想让他缩小后仍然没有滚动条,就把他的宽度1200px,改为百分比。定能药到病除。