×

DIV和SECTION有什麼區別?

元智汇电子 元智汇电子 发表于2023-09-27 14:24:42 浏览111 评论0

抢沙发发表评论

what is semantic html


HTML5div section article的區別

HTML5中新增了<header><footer><nav><section><article><aside><figure>多個有語義的結構化標籤元素。其中sectionarticle這兩個標籤和div差不多功能,很容易混淆。

  

div(分區division

  這個標籤是我們見得最多、用得最多的一個標籤,以至於Div+CSS成了HTML網頁設計的標準。本身沒有任何語義,用作佈局以及樣式化或腳本的鉤子。

 

section(章節)

  簡單地說section就是帶有語義的div<div></div>相當於<section id=""></section>

   section表示一段專題性的內容,一般會帶有標題。當一個標籤只是為了樣式化或者方便腳本使用時,應該使用div。一般來說,當元素內容明確地出現在文檔大綱、文章章節、博客條目、使用者評論部分或者論文中有編號的部分時,section就是適用的。


article(文章)

  article是一個特殊的section標籤,它比section具有更明確的語義,它代表一個獨立的、完整的相關內容塊。

 article代表的內容可以被外部引用。例如:博客中的一篇文章,論壇中的一個帖子或者一段流覽者的評論等。如果元素的內容集中到一起顯示可以表達相對獨立完整的意思,那就可以定義成article

 

  navaside的使用也是如此,這兩個標籤也是特殊的section

 

 semantic layout


群贤毕至

访客