整合營銷服務(wù)商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
av元素是什么？
Nav元素用于定義導航鏈接，是HTML5新增的元素，該元素可以將具有導航性質(zhì)的鏈接歸納在一個區(qū)域中，使頁面元素的語義更加明確。其中的導航元素可以鏈接到站點的其他頁面或者當前頁的其他部分。
Nav元素可以用作頁面導航的鏈接組，在導航鏈接組里面有很多的鏈接，點擊每個鏈接可以鏈接到其他頁面或者當前頁面的其他部分，并不是所有的鏈接組都要被放在Nav元素里面，只需要把最主要的、基本的、重要的放在Nav元素里面即可。
比如說頁腳底部如果有個版權(quán)聲明，不建議使用Nav元素，而建議使用footer元素是最合適的。一個頁面中可用多個Nav元素作為整體或者不同部分的導航
示例代碼：
Nav元素示例代碼
在上面這段代碼中，通過在Nav元素內(nèi)部嵌套無序列表ul來搭建導航結(jié)構(gòu)。通常一個HTML頁面中可以包含多個Nav元素，作為頁面整體或不同部分的導航。
具體來說Nav元素可以用的場景如下：
1.傳統(tǒng)導航條：目前主流網(wǎng)站上都有不同層級的導航條，其作用是跳轉(zhuǎn)到網(wǎng)站的其他主頁面。
2.側(cè)邊欄導航：目前主流博客網(wǎng)站及電商網(wǎng)站都有側(cè)邊欄導航，目的是將當前文章或當前商品頁面跳轉(zhuǎn)到其他文章或其他商品頁面。
3.頁內(nèi)導航：它的作用是在本頁面幾個主要的組成部分之間進行跳轉(zhuǎn)。
4.翻頁操作：翻頁操作切換的是網(wǎng)頁的內(nèi)容部分，可以通過單擊“上一頁”或“下一頁”切換，也可以通過單擊實際的頁數(shù)跳轉(zhuǎn)到某一頁。
除此Nav元素也可以用于其他重要的、基本的導航鏈接組中。并不是所有的鏈接組都要被放進Nav元素，只需要將主要的和基本的鏈接放進Nav元素即可。
PC端進行網(wǎng)頁制作時，經(jīng)常使用固定像素并且內(nèi)容居中的網(wǎng)頁布局，為了適應小屏幕的設(shè)備，在移動設(shè)備和跨平臺(響應式)網(wǎng)頁開發(fā)過程中，多數(shù)使用流式布局，下面我們就對流式布局進行詳細介紹。
流式布局是一種等比例縮放布局方式，在CSS代碼中使用百分比來設(shè)置寬度，也稱百分比自適應的布局。 流式布局實現(xiàn)方法是將CSS固定像素寬度換算為百分比寬度。換算公式如下: 目標元素寬度/父盒子寬度=百分數(shù)寬度 下面通過一個案例來演示固定布局如何轉(zhuǎn)換為百分比布局，如demo4-1.html 所示。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>固定布局轉(zhuǎn)換為百分比布局</title>
<style type="text/css">
body>*{ width: 980px; height:auto; margin:0 auto;
margin-top:10px;
border:1px solid #000; padding:5px;}
header{ height:50px;}
section{ height: 300px;}
footer{ height:30px;}
section>*{ height:100%; border:1px solid #000; float:left;}
aside{ width:250px;}
article{ width:700px; margin-left:10px;}
</style>
</head>
<body>
<header>header</header>
<nav>nav</nav>
<section>
<aside>aside</aside>
<article>article</article>
</section>
<footer> footer</footer>
</body>
</html>
打開Chrome瀏覽器訪問demo4-1.html，頁面效果如下圖所示。
可以嘗試改變?yōu)g覽器窗口的大小，頁面元素的大小不會隨瀏覽器窗口改變，如下圖所示。
下面修改demo4-1樣式代碼，將所有寬度修改為百分比的形式，具體如下:
<style type="text/css">
body>*{ width:95%; height:auto; margin:0 auto; margin-top:10px;
border:1px solid #000; padding :5px; }
header{ height:50px; }
section{ height: 300px; }
footer{ height:30px;}
section>*{ height:100%; border:1px solid #000; float:left; }
aside{ width:25.510204%; /*250÷980*/}
article{ width: 71.428571%; /*700÷980*/margin-left:1.0204088%;}
</style>
av元素用于定義導航鏈接，是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元素即可。
*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
