CSS网页设计实例:商旅网首页的标签切换

上个月的项目了。。。标签切换有很多方法可以实现，这里贴一段我个人很喜欢用的代码：

对于web标准化来讲，这种结构很清晰，当图片未显示的时候同样可以知道文本内容，而且有利于SEO。背景图片分两块：on和off效果，合并到一起，如图所示：

其中整个模块的底部圆角也合并到了图片上，本段代码不包括，请自行忽略~~~

1．给<ul>加上面那条背景，默认都为off状态，再分别给每个<li>加对应的on样式。通过js判断哪个菜单高亮，省略<a>标签；
2．li的高度设为零，这样html中的文字就不会显示了，再padding-top，把高度补回来。个人不推荐text-indent: XXXXem，有<a>时会看到焦点框已经超出屏幕。

附样式：

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!