對(duì)于初入門的網(wǎng)頁(yè)設(shè)計(jì)者和開(kāi)發(fā)者而言，學(xué)習(xí)網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)就應(yīng)該從HTML5和CSS3開(kāi)始，這是毋庸置疑的對(duì)于有經(jīng)驗(yàn)的工程師來(lái)說(shuō)，如果想完整掌握HTML5和CSS3新技術(shù)，那么HTML5+CSS3網(wǎng)頁(yè)布局和樣式精粹是最合適不過(guò)的。

步驟1 創(chuàng)建空白的HTML 5模版 首先，我們創(chuàng)建一個(gè)空白的模版，代碼很簡(jiǎn)單，如下所示復(fù)制代碼 步驟2 增加HTML 5新標(biāo)簽 HTML 5中新增加了不少標(biāo)簽，如article， aside， details， figcaption， figure， footer， header。

此外比較特殊的是彈性布局，彈性布局相對(duì)使用較少，需要根據(jù)項(xiàng)目的具體情況而定在網(wǎng)站開(kāi)發(fā)當(dāng)中，通常是需要結(jié)合多種布局去實(shí)現(xiàn)網(wǎng)頁(yè)布局的如果是在學(xué)習(xí)網(wǎng)頁(yè)布局的相關(guān)知識(shí)，可以弄本 HTML5布局之路 ，來(lái)輔助自己的學(xué)習(xí)。

html5新增的一些語(yǔ)義話標(biāo)簽，可以使用比如頭部可以使用header標(biāo)簽，導(dǎo)航nav，主體部分可以使用section，底部footer，中間文章articlediv，ul li標(biāo)簽都是使用比較頻繁的標(biāo)簽，span，i，em可以對(duì)文字進(jìn)行單獨(dú)的描述，表示等lt。

9 lthtml如果網(wǎng)頁(yè)編寫工具暫時(shí)不支持HTML5也沒(méi)關(guān)系，自己寫這幾行代碼也很簡(jiǎn)單說(shuō)明第一行l(wèi)t！DOCTYPE html是HTML5對(duì)文檔類型的簡(jiǎn)化，化繁為簡(jiǎn)文檔類型的作用驗(yàn)證器依據(jù)它來(lái)判斷該采用何種規(guī)則去驗(yàn)證代碼強(qiáng)制瀏覽器以標(biāo)準(zhǔn)模式。

常用布局上中下 三欄 少常用布局左中右 三欄也有左右 兩欄 還有很多，很多 可以用標(biāo)簽定位你需要的布局沒(méi)有固定格式。

簡(jiǎn)述當(dāng)前網(wǎng)頁(yè)設(shè)計(jì)語(yǔ)言選擇html5的五大理由這個(gè)問(wèn)題相當(dāng)于問(wèn)html5的優(yōu)點(diǎn)或者特性首先，web應(yīng)用程序更容易開(kāi)發(fā)HTML5的規(guī)范是基于用戶至上的準(zhǔn)則編寫的，符合開(kāi)發(fā)者的編碼習(xí)慣語(yǔ)法限制不嚴(yán)格，代碼更簡(jiǎn)潔易讀第二，功能。

列舉常用HTML5結(jié)構(gòu)組合 header nav section article figure figcaption aside footer 一般首頁(yè)結(jié)構(gòu)，如圖所示 當(dāng)然也可以是下面的結(jié)構(gòu) 其中section和article最為相似，而且和div標(biāo)簽貌似也有很大相似之處 但看似相似，并不是真的。