練習:
使用CSS美化前面做的純HTML頁面，實現(xiàn)以下效果（僅供參考，不要求100%一樣）：
CSS練習
分析
默認沒有css的情況下，html中的普通元素應該成流式布局。而觀察這張圖，可以得出以下結(jié)論：
- 整體頁面居中，兩邊的margin大于頂部和底部。
- 主標題居中。
- 頁面內(nèi)容按我們之前劃分的section成塊分布，有邊界，邊界有圓角。
- 前兩個塊中的元素布局改變，可以用
float或inline-block實現(xiàn)。 - 題目section中的小header有背景色，且margin為0。
- 所有題目的題干、個人信息的label部分字體偏大，且加粗。
- 判斷題的input后面添加了指定顏色的“?”和“?”，可以使用
:after或:before實現(xiàn)。 - 最后一個textarea布局改變，同樣可用
float或inline-block實現(xiàn)。
結(jié)果
備注
- CSS中的第一部分是CSS reset，減小不同瀏覽器的默認渲染造成的差距；
- 添加“?”和“?”的時候單獨在html中對應的input標簽后面加了一對空span，因為
:after和:before對input這種自閉合標簽無效（chrome的bug情況除外） - chrome默認字體解析特殊符號會出錯，“?”和“?”會變成方框，因此在css中限定了字體：
font-family: "Lucida Grande", Lucida Sans Unicode, Hiragino Sans GB, WenQuanYi Micro Hei, Verdana, Aril, sans-serif;
