網頁布局結構分析

section

標簽定義了文檔的某個區域。比如章節、頭部、底部或者文檔的其他區域

article

標簽定義獨立的內容

標簽定義的內容本身必須是有意義的且必須是獨立于文檔的其余部分

nav

并不是所有的 HTML 文檔都要使用到 <nav> 元素。<nav> 元素只是作為標注一個導航鏈接的區域。

在不同設備上（手機或者PC）可以制定導航鏈接是否顯示，以適應不同屏幕的需求

aside

<aside> 標簽定義 <article> 標簽外的內容。

aside 的內容應該與附近的內容相關

例如側邊欄

hgroup

<hgroup> 標簽被用來對標題元素進行分組。

當標題有多個層級（副標題）時，<hgroup> 元素被用來對一系列 <h2> - <h7> 元素進行分組

footer

<footer> 標簽定義文檔或者文檔的一部分區域的頁腳。

<footer> 元素應該包含它所包含的元素的信息。

在典型情況下，該元素會包含文檔創作者的姓名、文檔的版權信息、使用條款的鏈接、聯系信息等等。

在一個文檔中，您可以定義多個 <footer> 元素

header

<header> 標簽定義文檔或者文檔的一部分區域的頁眉。

<header> 元素應該作為介紹內容或者導航鏈接欄的容器。

在一個文檔中，您可以定義多個 <header> 元素。

注釋：<header> 標簽不能被放在 <footer>、<address> 或者另一個 <header> 元素內部

figure

<figure> 標簽規定獨立的流內容（圖像、圖表、照片、代碼等等）。

<figure> 元素的內容應該與主內容相關，同時元素的位置相對于主內容是獨立的。如果被刪除，則不應對文檔流產生影響

mark

<mark> 標簽定義帶有記號的文本。

請在需要突出顯示文本時使用 <mark> 標簽

progress

time

<time> 標簽定義公歷的時間（24 小時制）或日期，時間和時區偏移是可選的。

該元素能夠以機器可讀的方式對日期和時間進行編碼，這樣，舉例說，用戶代理能夠把生日提醒或排定的事件添加到用戶日程表中，搜索引擎也能夠生成更智能的搜索結果

details

<details> 標簽規定了用戶可見的或者隱藏的需求的補充細節。

<details> 標簽用來供用戶開啟關閉的交互式控件。任何形式的內容都能被放在 <details> 標簽里邊。

<details> 元素的內容對用戶是不可見的，除非設置了 open 屬性

datalist

<datalist> 標簽規定了 <input> 元素可能的選項列表。

<datalist> 標簽被用來在為 <input> 元素提供"自動完成"的特性。用戶能看到一個下拉列表，里邊的選項是預先定義好的，將作為用戶的輸入數據。

請使用 <input> 元素的 list 屬性來綁定 <datalist> 元素

ruby

<ruby> 標簽定義 ruby 注釋（中文注音或字符）。

在東亞使用，顯示的是東亞字符的發音。

將 <ruby> 標簽與 <rt> 和 <rp> 標簽一起使用： 
<ruby> 元素由一個或多個需要解釋/發音的字符和一個提供該信息的 <rt> 元素組成，還包括可選的 <rp> 元素，定義當瀏覽器不支持 "ruby" 元素時顯示的內容

<menu> 標簽定義了一個命令列表或菜單。

<menu> 標簽通常用于文本菜單，工具條和命令列表選項

tip:目前主流瀏覽器并不支持 <menu> 標簽

command

<command> 標簽可以定義用戶可能調用的命令（比如單選按鈕、復選框或按鈕）。

當使用 <menu> 元素時，command 元素將作為菜單或者工具欄的一部分顯示出來。但是，用 command 規定鍵盤快捷鍵時，command元素能被放置在頁面的任何位置，但元素不可見

tip:主流瀏覽器都不支持 <command> 標簽