加入收藏 | 设为首页 | 会员中心 | 我要投稿 衡阳站长网 (https://www.0734zz.cn/)- 数据集成、设备管理、备份、数据加密、智能搜索!
当前位置: 首页 > 运营中心 > 产品 > 正文

Web标准化之如何写符合标准的导航

发布时间:2018-09-16 23:02:09 所属栏目:产品 来源:站长网
导读:显然,Web标准并不是一个能够严格执行的标准,但是我们却可以像W3C推荐的那样尽可能的将页面实现标准化。 上周我们讨论了标准的导航写法: 第一种方案 ul class=nav lia/a/li lia/a/li lia/a/li /ul优点:相对有语义,多一个控制节点,可以灵活控制,实现

显然,Web标准并不是一个能够严格执行的标准,但是我们却可以像W3C推荐的那样尽可能的将页面实现标准化。

上周我们讨论了标准的导航写法:
第一种方案
<ul class="nav">
<li><a></a></li>
<li><a></a></li>
<li><a></a></li>
</ul>优点:相对有语义,多一个控制节点,可以灵活控制,实现二级菜单。
缺点:用户体验相对差些,UL的执行效率显然逊色于A标签。

第二种方案
<div class="nav">
<a></a>
<a></a>
<a></a>
</div>优点:代码简洁,能实现一般类型的导航,页面执行效率要不UL迅猛。
缺点:语义相对差些,若需实现较复杂的导航需要嵌套额外的标签。

那是不是有更标准的更符合语义的做法呢?有人说可以用HTML5里新增加的<nav></nav>.

但就目前来看,等待HTML5的发布还为时尚早,再加上不同浏览器的支持程度,更是不敢恭维。

有没有更加合理的解决方案能够填补这个空白? 有的!

请看如下代码:
<map>
<div>
<a></a><a></a><a></a>
</div>
</map>对 就是 map !W3C官网的写法!

W3C的说明是The MAP element may be used without an associated image for general navigation mechanisms.MAP元素可用于无关联的图像一般导航机制。

map具有地图、导航的特性,结合上面提到的第二个方案,这就是最佳解决方案。当然用map嵌套UL也是可以的,不过显然现在UL的语意就不是那么重要了。提醒大家的是map里面必须嵌套一层块级元素,因为map本身不具有此属性。

详细资料:http://www.w3.org/TR/REC-html40/struct/objects.html#adef-usemap
附:W3C官网;http://www.w3.org/

(编辑:衡阳站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读