標簽 <div>
The
<div>
element has no special meaning at all.
要點:無語義,最后考慮。
- 除非沒有合適的標簽可以使用,否則使用 div 會缺乏可讀性。
- 配合 class、lang、title 等屬性使用(賦予可讀性),標記一塊區域的內容。
例如進行樣式、視覺的處理。常用的比如使用 div 包含并使用 CSS 對網頁在瀏覽器窗口的位置進行居中,或者給整個網頁設置背景(圖片)。
我更偏向于把 <div>
元素理解為 division
。
標簽 <section>
The
<section>
element represents a generic section of a document or application.
要點:有主題性地分組。
對
內容
按 主題 分組:文章的章回、論文中編號的節、標簽對話框的多個標簽頁等。
在文章、論文中,對內容進行主題性的分組(通常會包含標題),例如劃分章節。一個簡單的評判標準:這個元素的內容體現在文章大綱 (outline) 中時,用<section>
是合適的。
標簽<section>
也適合在一個標簽式對話框中對各種標簽頁面進行分組。
當一個標簽只是為了樣式化或者方便腳本使用時,應該使用<div>
。網站頁面中可以用
<section>
把它劃分為網站介紹、主題內容、新聞、聯系信息等部分。
其實也是對網站的頁面內容按主題分組。
標簽 <article>
可以說,<article>
是一個特殊的 <section>
。
The
<article>
element represents an independent item section of content.
要點:可以單獨發布、重用的。
<article> 還是 <section> ?
閱讀這里的舉例,就能有一個大致的判斷。