nav的整理

(1)输入<nav>

(2)输入一组链接并将其标记为ul(无序列表)结构,除非链接的顺序比较重要(例如面包屑导航)。如果链接顺序重要,就将其标记为ol(有序列表)结构

 (3) 输入</nav>

nav能帮助屏幕阅读器识别页面的主导航,并允许用户通过键盘直接跳至这些链接。这可以提高页面的可访问性,提升访问者的体验。

HTML5规范不推荐对辅助性的页脚链接(如使用条款隐私政策等)使用nav,这不难理解。不过,有时页脚会再次显示顶级全局导航,或者包含商店位置招聘信息等重要链接。在大多数情况下,我们推荐将页脚中的此类链接放入nav中。

HTML5不允许将nav嵌套在address元素中。

role属性并不是必需的,不过它可以提高可访问性。


在这个页面中,只有两组链接放在nav里,另外两组则由于不是主要的导航而没有放在nav里。

 具体来说,nav元素可以用于以下场合

1、传统导航条:现在主流网站上都有不同层级导航条,作用是将当前画面跳转到其他主页上。

2、侧边栏导航:现在主流博客网站及商品网站都有侧边栏导航,其作用是将页面从当前文章跳转    到其他文章

3、  页面导航:页内导航的作用是在本页的组成部分之间进行跳转。

4、  翻页操作:翻页操作是指在网站的多个页面的前后页面或博客网站的前后文章之间滚动。

提示:如果文档中有前后按钮,则应该把它放到 <nav> 元素中。Nav可以使用到的地方,譬如:侧边栏上目录,面包屑导航,搜索样式,或者下一篇上一篇文章。

 

搜索样式的例子:


如果是单独的搜索栏可以加nav,最好不加;如果不是单独的搜索栏,与主要导航一起使用的时候,最好加nav


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值