nav元素是作为页面导航的链接组,其中的导航元素连接到其他界面或者当前页面的其他部分。但是并不是所有的导航元素都要放进nav元素中,只要将最主要的、基本的连接组元素放进nav元素即可。
nav元素应用:
1、传统导航栏
2、侧边栏导航
3、页内导航
4、翻页导航
下面是传统导航和页内导航的例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>模板页</title>
</head>
<body>
<header >
<p>这里是页面导航部分,根据导航内容跳转到其他页面 </p>
<nav id="daohang">
<ul>
<li><a href="#">主页</a></li>
<li><a href="#">相册</a></li>
<li><a href="#">日志</a></li>
<li><a href="#">留言</a></li>
</ul>
</nav>
</header>
<div id="main">
<p>这里是页内导航部分,根据导航内容跳转到当前页面的特定部分</p>
<article>
<h1>页内导航</h1>
<header >
<nav>
<ul>
<li><a href="#">W3C的标准</a></li>
<li><a href="#">HTML的历史</a></li>
<li><a href="#">CSS的发展进程</a></li>
</ul>
</nav>
</header>
<section id="one">
<h1>W3C的标准</h1>
<p>内容部分</p>
</section>
<section id="tow">
<h1>HTML的历史</h1>
<p>内容部分</p>
</section>
<section id="three">
<h1>CSS的发展进程</h1>
<p>内容部分</p>
</section>
</article>
</div>
<footer><p>版权声明,盗版必究</p></footer>
</body>
</html> |
|