纯CSS制作级联菜单
该实例完成大概就两个要点:
而IE6下折腾就比较复杂了,经过头破血流的教训之后,总结出关键四点: 1. 原理:IE6仅<a>标签支持:hover伪类,但如果a标签里面再嵌入a标签,里面的a标签将不会生效,所以必须在之间套加一层<table>; <!–[if IE 6]><a href="#nogo"><table><tr><td><![endif]–> 2. 关键样式名:这个用于:hover效果的a标签的命名,如果使用与<li>一致的样式名(在非IE6中是li:hover产生的效果),将不用再另写样式代码,不仅节省了代码开销,而且可维性更好;(这个是省时省力的关键) <li class="li"> 3. visibility的使用:采用display的话将出现onmouseout时上一次显示的optionGroup仍然不消失的情况 .c_subNav .li:hover ul { visibility:visible;} 4.table的设置: [含泪ing]table一定要记得width:100%;啊,一定要记得啊,一定要记得啊,一定要记得啊。 最后完成效果: 运行代码框 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢! |