首頁技術(shù)文章正文

nav標簽怎么用?nav標簽的有什么作用?

更新時間:2021-03-24 來源:黑馬程序員 瀏覽量:

1577370495235_學IT就到黑馬程序員.gif


nav元素用于定義導航鏈接,是HTML5新增的元素,該元素可以將具有導航性質(zhì)的鏈接歸納在一個區(qū)域中,使頁面元素的語義更加明確。其中的導航元素可以鏈接到站點的其他頁面,或者當前頁的其他部分。例如下面這段示例代碼:

<nav>
    <ul>
        <li><a href="#">首頁</li>
        <li><a href="#">公司概況</li>
        <li><a href="#">產(chǎn)品展示</li>
        <li><a href="#">聯(lián)系我們</li>
    </ul>
</nav>

在上面這段代碼中,通過在nav元素內(nèi)部嵌套無序列表ul來搭建導航結(jié)構(gòu)。通常,一個HTML頁面中可以包含多個nav元素,作為頁面整體或不同部分的導航。具體來說,nav元素可以用于以下幾種場合。

● 傳統(tǒng)導航條:目前主流網(wǎng)站上都有不同層級的導航條,其作用是跳轉(zhuǎn)到網(wǎng)站的其他主頁面。

● 側(cè)邊欄導航:目前主流博客網(wǎng)站及電商網(wǎng)站都有側(cè)邊欄導航,目的是將當前文章或當前商品頁面跳轉(zhuǎn)到其他文章或其他商品頁面。

● 頁內(nèi)導航:它的作用是在本頁面幾個主要的組成部分之間進行跳轉(zhuǎn)。

● 翻頁操作:翻頁操作切換的是網(wǎng)頁的內(nèi)容部分,可以通過單擊“上一頁”或“下一頁”切換,也可以通過單擊實際的頁數(shù)跳轉(zhuǎn)到某一頁。

除了以上幾點以外,nav元素也可以用于其他重要的、基本的導航鏈接組中。

需要注意的是,并不是所有的鏈接組都要被放進 nav元素,只需要將主要的和基本的鏈接放進nav元素即可。



猜你喜歡:

HTML5中figure標簽的作用

如何使用H標簽?

H5如何嵌入視頻?

傳智教育web前端培訓

分享到:
在線咨詢 我要報名
和我們在線交談!