div+css布局的基本流程

新建一个html文件，定名为test.html，用于讲解div+css结构的根基流程。

在test.html文件内，对body进行样式初始化，设置外边距margin为0，内边距padding为0，同时利用text-align设置文字居中。

在test.html文件内，为了讲解便利，设置所有的div高度为200px，内容的颜色为红色。

在test.html文件内，利用div建立网页的头部，利用margin:0 auto设置div居中，同时设置其宽度为800px，布景颜色为灰色。

在test.html文件内，利用div建立网页的中部，利用margin:0 auto设置div居中，同时设置其宽度为800px。

在test.html文件内，在网页的中部，建立两个div，用于将中部为两部门，每一个部门宽度为50%，左部门利用float:left设置左浮动，右部门利用float:right设置右浮动。

在test.html文件内，利用div建立网页的底部，利用clear:both断根上面div的浮动，避免影响底部的结构。同时，利用margin:0 auto设置div居中，同时设置其宽度为800px，布景颜色为#000fff。

在浏览器打开test.html文件，查看实现的结果。

0 条评论