HTML5的全新語義化元素

2022-06-03 18:18:09 字數 859 閱讀 1068

1.

元素用來定義文件或應用程式中的區域(或節)。例如,可以用它組織你的個人資訊,乙個用於聯絡資訊,另乙個用於新聞動態。需要重點理解的是用它不是為了美化樣式。如果你只想將某個元素包裹起來以便設定樣式,那應該和以前一樣繼續使用。

2.元素用來定義文件的主導航區域,其中的鏈結指向其他頁面或當前頁面的某些區域。因為用於主導航,所以嚴格來講它不是為頁尾或其他經常會包含一組鏈結的區塊而設計的(雖然將它用在這些區塊裡包含鏈結也沒問題)。

3.元素與元素很容易混淆。它是用來包裹獨立的內容片段。當搭建乙個頁面時,想想你準備放入標籤的內容能否作為乙個整塊而被複製貼上到另外乙個完全不同的**且能保持完整的意義?另乙個方法是,想想包裹中的內容能否在rss訂閱源中獨立成為一篇文章?應該使用標籤包裹的內容,最明顯的例子就是部落格正文。注意,如果出現巢狀的元素,那內層的元素內容應該和外層文章內容直接有關。

4.5.

如果頁面中有一組使用、、等標籤的標題、標語和副標題,則可以考慮使用將他們包裹起來。這樣在html5的大綱結構演算法中就會隱藏次級標題元素,從而只讓中的第乙個標題元素進入文件大綱。

注:可以使用下面的html大綱生成器來測試生成網頁的大綱結構:

(1)(2)

6.由於元素不計入大鋼結構,所以不能用它來劃分內容結構,而是應該用它來包含對區域內容的介紹說明。實際使用中,可用作**頭部的「刊頭」區域,也可用作對其他內容如元素的簡要介紹。

7.和一樣,元素也不計入大綱結構,所以也不能用於劃分內容結構。應該用它來包含其所在區域的輔助資訊。例如可以用它包含一組指向其他頁面的超連結,或者用它包含版本資訊。和一樣,它也可以視情況在同乙個頁面上多次出現。例如部落格**的頁尾可以使用它,同時部落格正文元素內的文腳也可以使用它。不過規範指出,博文作者的聯絡資訊應該使用元素來包裹。

8.

HTML5新語義化標籤 (一)

1 html4.0開始出現 div span img h1 h6等 2 html5開始出現 header footer main等 3 css2.1開始 widht height background等 4 css3新增 transform border radius等 header 頁首 foot...

HTML5新語義化標籤 (二)

一 分欄布局 column 分欄,將一段文字按照一定寬度分成多個欄目 類似於報紙介面 值 count 分欄的個數 width 分欄的寬度 gap 欄與欄的間距 rule 分欄的邊線 span num all 合併分欄 注 count width 不要一起去寫,容易衝突。二 偽類與偽元素 elem a...

HTML5中新語義化標籤

header 定義當前頁面的表頭 footer 定義頁面的頁尾 main 頁面主體 注 header footer main 語義化標籤在乙個頁面中只能出現一次 這是一張datalist 選項列表 涉及到的語法 list id value html 超文字標記語言 progress meter 定義...