練習:
使用CSS美化前面做的純HTML頁面，實現(xiàn)以下效果（僅供參考更鲁，不要求100%一樣）：
CSS練習
分析
默認沒有css的情況下茫多，html中的普通元素應該成流式布局。而觀察這張圖吐限，可以得出以下結論：
- 整體頁面居中鲜侥，兩邊的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)。
結果
備注
- 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;
