HTML中的div,section,article的區別



剛開始看到標簽的就有些疑惑,覺得為什么有那么多相同用途的標簽,多方查詢資料細細比較之后才發現原來各有千秋,結合自己的想法總結如下:

div在HTML早期版本就支持了,section和article是HTML5提出的兩個語義化標簽。

 

div

定義:文檔中的分區或節。

使用場合:作為布局以及樣式化時使用(此時三者並無區別,但div更常用)

提示:<div> 是一個塊級元素,瀏覽器通常會在 div 元素前后放置一個換行符。


section

定義:文檔中的節,一般是具有標題性的。

使用場合:文章的章節、標簽對話框中的標簽頁、或者論文中有編號的部分。

提示:section不僅僅是一個普通的容器標簽,這區別與div標簽。一般來說,當元素內容明確地出現在文檔大綱中時,section 就是適用的。

 

article:

定義:獨立的自包含內容。一般來說,article會有標題部分( 包含在header內 ),有時也會包含footer。

使用場合:一段內容脫離了所在的語境,仍是完整的、獨立的,則應該用article標簽。

提示:雖然section也是帶有主題性的一塊內容,但是無論從結構上還是內容上來說,article本身就是獨立的、完整的。


總結:
(1)div section article ,語義是從無到有,逐漸增強的。
(2)div 無任何語義,僅僅用作樣式化或者腳本化;對於一段主題性的內容,則就適用 section;假如一段主題性內容脫離上下文后仍是完整且獨立存在的一段內容,則就適用 article。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM