nav 字面上理解爲“導航”,在html5中用於包裹一個導航鏈接組,用於顯式的說明"這是一個導航組”,在同一個頁面中可以同時存在多個nav。
- 不是所有的鏈接組都需要使用nav包裹,這主要看鏈接組是不是用於導航(可理解爲是不是再頁面中充當導航這一角色),鏈接可以是一些操作,如刪除,編輯;可以是一些提示性元素,如鏈接到其他網站的解釋。
- 導航,顧名思義,就是引導的路線,那麼具有引導功能的都可以認爲是導航,如網站的欄目,側邊欄的相關內容,翻頁操作,一個本書的章節導航,一章書的分段導航。
- 導航可以頁與頁之間導航,也可以是頁內的段與段之間導航。
- nav是一個明確定義功能的元素,所以從文檔的意義比功能的意義更大。【html5zhan】
情景一:
頁面導航
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<!doctype html> < title >html5zhan nav元素情景一</ title > < header > < h1 >html5zhan nav元素情景一< h1 > < nav > < ul > < li >鏈接1</ li > < li >鏈接2</ li > < li >鏈接3</ li > </ ul > </ nav > </ h1 ></ header > < article > </ article > < footer > </ footer > |
情景二:
段內導航
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<!doctype html> < title >html5zhan nav元素情景二</ title > < header > </ header > < article > < hgroup > < h2 >文章的標題< h2 > < nav > < ul > < li >< a
href = "#p1" >段一</ a ></ li > < li >< a
href = "#p2" >段二</ a ></ li > < li >< a
href = "#p3" >段三</ a ></ li > </ ul > </ nav > </ h2 ></ hgroup > < p
id = "p1" >段一</ p > < p
id = "p2" >段二</ p > < p
id = "p3" >段三</ p > </ article > < footer > </ footer >
|