在HTML5標(biāo)準(zhǔn)中，新加了幾個(gè)用于增添頁(yè)面語(yǔ)義的標(biāo)簽，這些標(biāo)簽有：article、section、nav和aside等。與別的大多數(shù)標(biāo)簽不 同，瀏覽器在解釋渲染這些標(biāo)簽的時(shí)候僅僅把它作為普通的div塊級(jí)元素來(lái)處理，不會(huì)添加任何額外的展現(xiàn)邏輯；也即，這些標(biāo)簽僅用于增添語(yǔ)義。對(duì)于Web開(kāi) 發(fā)人員而言，使用這些標(biāo)簽的實(shí)際意義主要有2點(diǎn)：搜索引擎優(yōu)化，以及增加頁(yè)面的可用性(accessibility)。

在元素分類(lèi)上，article、section、nav和aside稱(chēng)之為“Sectioning Content”

article

article元素可用于表示頁(yè)面上某塊具有一定獨(dú)立性的內(nèi)容，這個(gè)內(nèi)容可以是一篇文章、論壇上的一個(gè)帖子/評(píng)論、一篇博客、一個(gè)可交互的控件 等。article標(biāo)簽可以嵌套使用，當(dāng)這么做時(shí)，子article元素與父article元素在邏輯上必須有相應(yīng)的關(guān)聯(lián)。如Web開(kāi)發(fā)者可以將一篇博客 的正文以及評(píng)論作為父級(jí)article元素，而將其中的各個(gè)評(píng)論作為子article元素。

article元素內(nèi)部不能出現(xiàn)main元素 — main元素意指頁(yè)面的主要內(nèi)容，當(dāng)有main元素時(shí)，article元素作為main元素的子元素而存在。

section

section元素意指頁(yè)面或Web應(yīng)用中的一部分，不同的section互相之間其“主題”或者說(shuō)“基調(diào)”應(yīng)當(dāng)有所不同，一般會(huì)通過(guò)在section元素內(nèi)放置heading元素(h1-h6)來(lái)定義這個(gè)“主題”/“基調(diào)”。

把section當(dāng)成div使用是一種錯(cuò)誤 — 除了頁(yè)面可展現(xiàn)的內(nèi)容，section的子元素不應(yīng)該承擔(dān)任何其它角色(樣式、行為、輔助標(biāo)簽等)。

nav

nav元素主要用于包含頁(yè)面上的導(dǎo)航鏈接，因此在nav元素中直接包含ul元素或者ol元素是一種非常常見(jiàn)的做法。盡管如此，nav中也可以不包含ul或者ol元素，比如在nav元素中可以包含一個(gè)文章段落(p標(biāo)簽)，而在該文章段落中包含一些鏈接(a標(biāo)簽)。

與article元素一樣，nav元素內(nèi)部不能出現(xiàn)main元素。

aside

aside元素一般用于表示頁(yè)面上的側(cè)邊欄，不過(guò)該元素僅僅只在語(yǔ)義上表示“側(cè)邊欄”，瀏覽器在解析渲染該標(biāo)簽時(shí)只會(huì)將其作為普通的div塊級(jí)元素來(lái)處理。如果要真正得到側(cè)邊欄的效果，則Web開(kāi)發(fā)人員需要自己編寫(xiě)CSS來(lái)實(shí)現(xiàn)。

以上這篇HTML5之語(yǔ)義標(biāo)簽介紹就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

原文地址：http://www.cnblogs.com/krolong/archive/2016/07/07/5648710.html