map标签
最近飞猪一直问我map这个标签用来做什么？因为他看到腾讯的音乐频道用它来写导航，最开始的时候我没做思索就回答说，估计是个外行人做的吧，因为在我的印象中，这个就是最初的时候我用Fireworks切图的时候，直接输出html这样子产生的标签。然后后来飞猪说，他问过了鬼和greengnn，他们说这样子更语义化，而且鬼博客上的导航也使用了同样的标签。然后我就在网上查了查，说下我查到的结果。
首先是看W3C对map的解释：
The MAP element specifies a client-side image map (or other navigation mechanism) that may be associated with another elements (IMG, OBJECT, or INPUT). An image map is associated with an element via the element’s usemap attribute. The MAP element may be used without an associated image for general navigation mechanisms.
简单的说就是定义一个客户端图像映射，图像映射（image-map）指带有可点击区域的一幅图像。特别注意一下最后一句话：The MAP element may be used without an associated image for general navigation mechanisms.意思是，map标签可以不去定义一个映射，而用来定义一个普通的导航。所以说，腾讯的做法还是比较有语义的，可能或许HTML5流行以后，nav要比map更语义化。另外，我觉得，导航上，干嘛非要用li，像腾讯这样子用a就蛮好滴，但是有一点我不喜欢的就是用float，既然用了a，用inline-block应该要比float更好用一些吧哈~
腾讯音乐频道的导航：
<map id="menu"> <div><a id="menu_index" href="http://music.qq.com">首页</a> <a id="menu_musicdata" href="/portal_v2/static/list/singerlist_0.html">正版音乐库</a> <a id="menu_first" href="/portal_v2/static/shoufa/shoufa_1.html">在线首发</a> <a id="menu_hit" href="/portal_v2/static/hit/hit_5_1.html">点击榜</a> <a id="menu_player" href="/portal_v2/static/player.html">播放器</a> <a target="_blank" class="hot" id="menu_green" href="http://vip.music.qq.com">绿钻专区<sup><span>hot</span></sup></a> <a id="mengniu" href="/portal_v2/static/player.html">下载播放器</a><a id="openplayer" href="http://service.qq.com/category/music.html" target="_blank">腾讯客服</a></div> </map>
参考资料：
标签： map
这篇文章发布于 2009年04月28日，星期二，22:46，归类于 HTML。 您可以跟踪这篇文章的评论通过 RSS 2.0 feed。 您可以留下评论，或者从您的站点trackback。
哈，长知识了。