扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
nav 是html5新增的标签,主要用于制作导航( navigate)菜单。其实它本身是没有什么特殊性的,用div也一样可以,但它具有语义性,可以增加代码的可读性,如果一个html文档中全部是div标签,时间一长,别说是别人,就连编写者自己如果没加注释都可能分不清哪个是哪个了。而用了nav就不同了,啥时候一看,即使英文再差也大概知道它与导航有关。html5新增的那些标签如section、header、footer、article等基本上都是这个作用。
成都创新互联公司是由多位在大型网络公司、广告设计公司的优秀设计人员和策划人员组成的一个具有丰富经验的团队,其中包括网站策划、网页美工、网站程序员、网页设计师、平面广告设计师、网络营销人员及形象策划。承接:成都做网站、成都网站制作、成都外贸网站建设、网站改版、网页设计制作、网站建设与维护、网络推广、数据库开发,以高性价比制作企业网站、行业门户平台等全方位的服务。
html5中menu和nav的区别如下:
1、menu就是页面中的菜单,而nav是导航条
2、菜单是一组控件的集合,比如按钮,文本框等,通常菜单都要关联一个js事件进行人机交互。
导航是网站的一组链接的集合,主要是a标签,这些链接是指向各个子页面的,或者通过ajax异步更新页面数据。
3、菜单是一个web应用中的各个交互入口,而导航是一个网站的指引入口。
nav是 HTML5 的新标签, 标签定义导航链接的部分。
并不是所有的 HTML 文档都要使用到 nav 元素,nav 元素只是作为标注一个导航链接的区域。
标记意义比较大,示例如下:
HTML5中的新元素标签nav用来将具有导航性质的链接划分在一起,使代码结构在语义化方面更加准确,同时对于屏幕阅读器等设备的支持也更好。
一直以来,我们习惯于使用形如div id="nav"或ul id="nav"这样的代码来写页面的导航;在HTML5中,我们可以直接将导航链接列表放到nav标签中:
nav
ul
lia href="index.html"Home/a/li
lia href="/about/"About/a/li
lia href="/blog/"Blog/a/li
/ul
/nav
根据W3C的定义规范:
nav元素是一个可以用来作为页面导航的链接组;其中的导航元素链接到其他页面或当前页面的其他部分。并不是所有的链接组都要被放进nav元素;例如,在页脚中通常会有一组链接,包括服务条款、首页、版权声明等;这时使用footer元素是最恰当的,而不需要nav元素。
The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links. Not all groups of links on a page need to be in a nav element only sections that consist of major navigation blocks are appropriate for the nav element. In particular, it is common for footers to have a list of links to various key parts of a site, but the footer element is more appropriate in such cases, and no nav element is necessary for those links.
一个页面中可以拥有多个nav元素,作为页面整体或不同部分的导航;下面是W3C给出的一个代码示例:
body
h1The Wiki Center Of Exampland/h1
nav
ul
lia href="/"Home/a/li
lia href="/events"Current Events/a/li
...more...
/ul
/nav
article
header
h1Demos in Exampland/h1
pWritten by A. N. Other./p
/header
nav
ul
lia href="#public"Public demonstrations/a/li
lia href="#destroy"Demolitions/a/li
...more...
/ul
/nav
div
section id="public"
h1Public demonstrations/h1
p...more.../p
/section
section id="destroy"
h1Demolitions/h1
p...more.../p
/section
...more...
/div
footer
pa href="?edit"Edit/a | a href="?delete"Delete/a | a href="?Rename"Rename/a/p
/footer
/article
footer
psmall© copyright 1998 Exampland Emperor/small/p
/footer
/body
在这个示例中,我们可以看到nav不仅可以用来作为页面全局导航,也可以放在article标签内,作为单篇文章内容的相关导航链接到当前页面的其他位置。
Nav元素可以用作页面导航的链接组,在导航链接组里面有很多的链接,点击每个链接可以链接到其他页面或者当前页面的其他部分,并不是所有的链接组都要被放在nav元素里面,我们只需要把最主要的、基本的、重要的放在nav元素里面即可。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流