練習:
使用純html實現考試頁面(不使用任何css/js)税娜,使用正確合適的標簽做出如下的頁面效果聋庵。內容需要完全一樣,但頁面樣式僅供參考:
分析
按內容將頁面劃分:
-
整個頁面的header粘室,剩下的由于都有提交的部分栓辜,放到一個form中,作為一個article:
-
在form/article中隧土,把這部分當作header芽死,因為題目無論怎么換,個人信息都需要填:
-
剩下的題目次洼,按大題分成section关贵,沒過section中用
<ol>
承載題目:
-
最后,提交按鈕作為article/form的footer:
那么頁面的整體結構如下:
結果
簡書markdown編輯器太兇殘了卖毁,我就不粘代碼了揖曾,整體代碼在這里,還有效果亥啦。
html文件中的標簽比較多炭剪,主要是為了兼顧下個練習中對CSS的使用。