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

在元素分類上，article、section、nav和aside稱之為“Sectioning Content”

article

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

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

section

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

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

nav

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

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

aside

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

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

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

最新評論