在介紹HTML5布局之前，我們先了解一下幾個名詞的概念。
大綱：
所謂大綱簡單說就是文檔中各內容區塊的結構編排。內容區塊可以使用標題元素(h1~h6)來表示各級內容區塊的標題，綜合運用各級內容區塊的標題創建好文檔的目錄后，該目錄就是一個大綱了。
顯示編排：
是指明確使用section等元素創建文檔結構，在每個內容區塊內使用標題(h1~h6)。
隱式編排：
是指不明確使用section等元素，而是根據頁面中所書寫的各級標題(h1~h6、hgroup)等把內容區塊自動創建出來。
下面介紹在HTML5中幾種在頁面布局時注意的細節：
1)顯示編排內容區塊
對於顯示編排的概念，上面已經解釋過了。下面我們舉例說明：
2)隱式編排內容區塊
舉例說明：
從上面兩種方式對比，顯示編排更加清晰、易讀。
3)標題分級
不同的標題有不同的級別，h1級別最高，h6級別最低。隱式編排時按下面規則自動生成內容區塊：
▪ 如果新出現的標題比上一個標題級別低，生成下級內容區塊。上面的例子已經說明。
▪ 如果新出現的標題比上一個標題級別高或級別相等，生成新的內容區塊。下面舉例：
如果將結構都改成顯示編排，那么分析器就會自動按照編寫的結構實現了。
因為隱式編排容易讓自動生成的整個文檔結構與想要的文檔結構不一致，而且很容易引起文檔結構的混亂，所以盡量使用顯示編排的方法進行頁面布局。
4)不同的內容區塊可以使用相同級別的標題
父內容區塊與子內容區塊可以使用相同級別的標題h1。這樣的好處是：每個級別的標題都可以單獨設計，如果既需要“網頁級的標題”，又需要“文章的標題”，這樣做將會帶來很大的便利性。舉例：
5)新的結構元素樣式調用
由於目前很多瀏覽器不支持HTML5中的多數新增元素，而且我們也不清楚客戶端使用的瀏覽器類別，所以在編寫CSS時追加如下聲明：
目的是通知瀏覽器頁面中使用的HTML5新增元素都是以塊方式顯示的。
其次，由於IE8及之前版本的瀏覽器是不支持CSS的方法來使用這些尚未支持的結構元素，為了在IE中能正常使用這些結構元素，需要使用JS來完成，如下代碼：
如果瀏覽器支持HTML5中的結構元素，那么上面的這段JS腳本是沒有必要的，但是它並不會對這些瀏覽器造成不良影響。
6)HTML5中，推薦使用article嵌套article的方式
一個頁面中可以有多個獨立的article元素，每一個article元素都允許有自己的標題和腳注等從屬元素，並允許對自己的從屬元素單獨設置樣式。如：
通過上面的講解，你是不是對HTML5頁面布局有了全新的認識?繼續關注我們的教程，學習更多關於HTML5的內容。希望我們的教程為你在制作頁面的道路走的更遠!