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 條評論