雖說html5中大多數功能性的元素如<video><canvas><audio>等還得不到當前主流瀏覽器的支持(主要就是指IE瀏覽器了),但至少那些個與布局相關的元素同html5.js結合起來時我們是可以放心使用的,比如<header>,<footer>,<nav>,<section>,<article>,<aside>,<figure>這幾個最常用的元素。
Article 和 Section
article元素是文檔中的獨立部分,博客條目、文章或其它由文字構成的內容都應該使用這個標簽。基本上,你可以很廣泛的使用這個標簽來構造頁面的文字部分。
section元素是最容易讓人誤解的元素,因為人們認為它就是用來代替div元素的,但事實並非如此。實際上,section元素與article元素的關系非常緊密,比如一篇文章中的章節可以用section標簽來區分。總的來說,這個標簽主要用來把頁面的內容部分划分成有內在關系的幾個區域。
Header 和 Footer
這兩個元素自不用說了,分別代表頁面的頭部和底部。但話說回來,這兩個元素代表的不僅僅就只是傳統意義上我們所講的頁面頭部和底部,事實上,它們可以被更加靈活的在頁面各個部分進行應用。
Nav
nav元素主要是指頁面的導航菜單部分,里面可包含能鏈接到頁面其他部分的超鏈接。總之記住在頁面的導航區域使用該標簽就對了。
Figure 和 Figcaption
跟據w3c的說法,這兩個元素是用來表示在主文檔流之外但又跟文檔內容息息相關的那些個部分,其實主要就是指圖表、圖像、數據引用等這些個能更好的體現文檔內容的東西,而且刪掉也不會影響主文檔內容。Figcaption是指這些多媒體元素的標題。
Aside
aside元素是指脫離主文檔主題之外或以主文檔內容關系不大的那些區域,典型的應用就是頁面的側邊欄之類的啦。
之后在構造頁面的時候就多想想吧,看看哪些div是能用上面那些標簽來代替的。如果確實是找不到對號入座的元素,那就還是用div吧,因為div在HTML5中並沒有被廢除,只是作用減弱了而已。對了,在不支持html5標簽的瀏覽器中千萬別忘加上html5.js哦!