html5中nav標籤(導航連結)的詳細介紹

2020-12-06 國哥筆記

大家好,歡迎關注支持,謝謝!本篇將介紹html5中nav標籤(導航連結)的詳細用法,有興趣的朋友可以了解一下!

在html5版本中,新增了很多語義標籤,比如:header標籤、footer標籤、aside標籤、nav標籤等等。這些語義標籤沒有實際的顯示效果,只是起到語義的作用。今天小編要介紹的就是其中一個,即nav標籤。nav標籤目前已經用的比較多了,通常在網站導航原始碼中都能看見它的蹤影。接下來跟著小編一起來學習html中的nav標籤吧!

html5

「nav」是英文單詞「navigation」縮寫,有「導航」的意思。那它在html中作為標籤又有什麼意思呢?我們一起來看看nav標籤的定義及用法吧!

一、nav標籤定義及用法

在html中,nav標籤是html5版本中新增的標籤,是使用來定義導航連結的部分。nav標籤只是用來表示該區域是導航連結,默認並沒有什麼顯示效果。

通過nav標籤能更好的實現在不同設備上(如:手機、電腦等)控制導航連結是否顯示,從而讓網頁適應不同大小的屏幕。

html5中nav標籤

二、nav標籤語法格式

<nav>導航連結</nav>

說明:

nav標籤中的內容默認沒有顯示效果,只表示該區域是導航連結部分;nav標籤只起語義的作用,沒有實際的顯示效果;nav標籤中的內容通常是一個列表;三、實例

<!DOCTYPE html><html><head>

<meta charset="utf-8" />

<title>html5中nav標籤(導航連結)的詳細介紹</title>

</head>

<body style="background-color: bisque;">

<h3>nav標籤演示:</h3>

<nav>

<a href="#">首頁</a><a href="#">web前端</a>

<a href="#">伺服器端</a><a href="#">關於</a>

</nav>

<h4>IE 8以及更早的版本不支持nav標籤</h4>

</body></html>

運行結果:

nav標籤演示

好了,關於html5中nav標籤(導航連結)的詳細介紹就到此結束了,希望能幫助大家!

相關焦點

  • html中span標籤的詳細介紹
    本篇將介紹html中span標籤的詳細用法,有興趣的朋友可以了解一下!「span」作為英文單詞有「範圍」的意思,那它作為html中的標籤又充當什麼樣的角色呢?接下來我們一起來看看html中span標籤的定義及用法吧!
  • 用css配合HTML代碼製作導航條下拉麵板
    導航下拉麵板能讓導航裝載更多的內容,添加更多的關鍵詞,有利於優化,也使網站顯得更加高端大氣,如果您需要,我就來提供!{width:960px; height:36px; margin:0 auto;}.nav li{float:left; width:130px; border-right:#FFF solid 2px; text-align:center;}.nav .last{border-right:none;}</style>html代碼片段<div><ul ><
  • GPS導航地圖怎麼用?凱立德導航詳細評測
    凱立德導航詳細評測    凱立德是中國導航用戶接觸得最多的導航系統之一,由於其操作簡單實用深受廣大用戶歡迎,不過小編在這裡想問問大家:您知道凱立德都有哪些功能?帶著這樣的疑問與對導航系統不夠「聰明」的懷疑態度,一起進入本次凱立德導航詳細評測。
  • HTML5調用攝像頭並拍照
    利用html5特性,調用攝像頭,並利用canvas拍照先簡單的添加需要的控制項<video id="video" autoplay=""style='width:640px;height:480px'></video><button id='picture
  • meta標籤詳解:網頁中的meta標籤的作用
    原代碼中 10 表示 10秒。 meta 是用來在HTML文檔中模擬HTTP協議的響應頭報文。meta 標籤用於網頁的<head>與</head>中,meta 標籤的用處很多。meta 的屬性有兩種:name和http-equiv。
  • 教大家如何編寫一個網頁導航條
    導航條簡單地說就是對你整個網站模塊的簡單介紹,你可以直接點擊導航條某一個按鈕或板塊便可進入其相應的界面,如:網頁、新聞、貼吧等 。在企業網站上,導航條上常見的有:產品介紹,公司簡介,最新產品,聯繫我們。而現在導航條的編寫方式多種多樣,如:CSS、Jquery、Bootstrap等。
  • 盤點界面編程中那些常用控制項,詳解PyQt5中標籤控制項QLabel的使用
    PyQt比較受歡迎的地方在於其強大的控制項支持,從本篇開始,我將帶大家詳細了解下PyQt5中的一些常用控制項。喜歡Python編程的小夥伴們關注我,後續會推出一些GUI編程相關內容。那麼,QLabel中提供的常用信號有哪些呢?主要針對超連結中使用的信號進行說明:
  • a標籤 href vue專題及常見問題 - CSDN
    此處的將a的標籤href實現綁定:href同時對路徑進一步轉化拼接以上這篇vue.js 實現a標籤href裡添加參數就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持我們。時間: 2019-11-10公司要做一個類似今日頭條的項目,用前後端分離的方式做成HTML5頁面,先在微信中運行,領導說想看看效果怎麼樣.今日頭條頭部的導航是可以滾動和添加類別的,我們這個項目也是一樣.所以在導航這個地方就需要在點擊不同分類的同時,樣式也是跟著變的,我在網上搜索了一下,發現了下面的代碼,簡潔清淅,不過具體網址忘記了
  • Excel如何批量建立超連結,搭建工作檯
    本篇是「建立工作導航」的第3講,如果您錯過了前兩篇,請點擊下方連結:用EXCEL製作導航頁和日誌表管理日常工作>對於公式的使用方法,按F1,直接搜索公式,原生的幫助文檔已經非常詳細地介紹了使用方法。「&」建立文件路徑在EXCEL表格中,建立三列輔助列,用以得到文件名、文件路徑。
  • 網頁開發HTML5入門內容,一起來學習吧
    請注意,從技術上講,<img> 標籤並不會在網頁中插入圖像,而是從網頁上連結圖像。<img> 標籤創建的是被引用圖像的佔位空間。<img> 標籤有兩個必需的屬性:src 屬性 和 alt 屬性。<img src="文件名/網站地址名圖片" >對於src屬性,如果是本地圖片,輸入文件名。
  • 遊戲王決鬥連結有哪些人物 角色介紹及解鎖方法
    標籤: 解鎖 作為一款漫改手遊,遊戲王決鬥連結中我們可以解鎖眾多熟悉的動漫角色,而很多萌新剛開始上手,想必對於遊戲王決鬥連結有哪些人物還不是很了解,這裡就給大家帶來了人物角色介紹,以及不同角色的解鎖方法匯總。
  • SEO優化您必須了解的連結「rel」屬性
    rel屬性的一般語法是:<a rel="nofollow" href="域名">這是一個連結</a>。rel屬性定義了連結資源和當前文檔之間的關係。因此,在上面的示例中,rel屬性定義了包含連結的頁面和連結到的頁面之間的關係。在這種情況下,該關係為nofollow。
  • 路痴的最後一公裡,「隨便走」來實景導航 | 獵雲網
    隨便走是深圳感知網絡有限公司開發的一款App,設計初衷在於幫助路痴們在最後一公裡內,進行實景城市生活導航。和一般的導航地圖不同的是它融合了AR技術,用戶在找不著北的時候,打開軟體、豎起手機旋轉屏幕右上角羅盤,在一公裡的限定範圍內,可以掃描出所有相關目的地,並以標籤的形式顯現在屏幕上。
  • 車載導航是什麼系統?車載導航介紹
    導讀:車載導航是什麼系統?車載導航介紹隨著汽車的普遍發展,車載導航成了每個家庭的必備品。它通過GPS定位系統精確地使人可以到達想去的地方。下面小編就來帶領大家認識一下車載導航系統。車載導航介紹:GSP車載導航系統主要由主機、顯示屏、操作鍵盤(遙控器)和天線組成。
  • 網站麵包屑導航有哪些設計技巧?
    麵包屑導航旨在滿足用戶體驗,因此提高網站上某些關鍵詞的排名非常有幫助,有利於網站的優化效果。因此,在網站導航的設計中,不僅要考慮用戶體驗,還要考慮搜尋引擎的爬行。建議將麵包屑導航控制在4個級別內,因為級別太多可能會導致網站上的麵包屑被拖拽和繁瑣。
  • 什麼是拼多多人群標籤,如何布局人群標籤?
    今天,我們要講的是關於拼多多人群標籤內容。人群標籤的重要性對於拼多多運營來說非常的重要,而人群標籤的精度與流量精準度直接相關,流量精準度又於轉化率直接相關,所以想要自己的連結轉化能力比對手強,從而積累更高的權重,進而拿到更高的排名,分配到更多地流量,就必須要從人群標籤入手,掌握人群標籤的布局。
  • 《天龍八部3》龍紋裝備系統詳細介紹
    分頁導航: 第01頁:《天龍八部3》龍紋裝備背景詳細介紹
  • 遊戲王決鬥連結黑魔導卡組抽什麼卡包 黑魔導卡組構建攻略[多圖]
    遊戲王決鬥連結黑魔導卡組抽什麼卡包最划算?黑魔導卡組怎麼構建?黑魔導卡組的強悍程度相比大家都從動漫中感受到了,不少的玩家也想獲得黑魔導卡組。下面小編就為大家詳細的介紹一下構建方法。遊戲王決鬥連結黑魔導卡組構建攻略第20小盒兩盒,10000鑽石,黑魔導套牌一盒,1000鑽石。
  • 基於慣性導航、RFID 及圖像識別的 AGV 融合導航系統
    針對慣性導航方式中的誤差累積和定位精度問題,本設計引入RFID 技術與圖像識別技術,將位置信息存儲在RFID 標籤中,圖像識別獲取姿態信息,實現AGV的輔助定位,提高自動化效率。融合導航方案如圖1 所示,該技術方案不僅可以保證慣性導航系統的精度及可靠性,同時還可以將RFID 標籤作為站點識別的載體,使AGV 可以隨時上線,避免了人工輸入錯誤的情況[3]。採用柵格狀RFID 標籤進行導航和站點標識,柵格狀標籤設置示例如圖2 所示( 圖中為了路徑清晰用灰框代替RFID 標籤)。