本实例要制作三行二列网页布局，这是网页制作中最常见的布局方式，如何使整个页面内容居中，如何使高度适应内容自动伸缩，是本实例中的难点。
Tips:You can change the code before run.
代码解释：
#header,#contain,#footer{
margin-right: auto;
margin-left: auto;
}
是让网页整体居中。为了使中间两列#right和#left也居中，我们在它们外面嵌套一个层#contain，并对contain设置margin:auto;，这样#right和#left就居中了。
注意中间两列定义的顺序，我们首先定义#right，通过float: right;让它浮在#contain层的最右边。然后再定义#left，通过float: left;让它浮动在#right层的左面。
后是定义底部的#footer层。这个定义的关键是：clear:both;，作用是取消#footer层的浮动继承。否则的话，你会看到#footer着#header显示，而不是在#right的下面。
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/2307.html
微信扫一扫 
支付宝扫一扫