导航中的小竖线--总结

来源:互联网 发布:淘宝买口服催情药 编辑:程序博客网 时间:2024/06/15 02:19

对于那种小竖线在一级菜单左侧的处理方法


方法一:!important;的应用

首先对每一个li元素添加背景图片(小竖线),对于第一个(一般为首页)选项添加单独的类xxx,样式定为

.xxx{
  1. backgroundnone !important;
}
注释:所有被!important;标记的样式,即使后来被重写,浏览器也只会采用被标记的那一条(即 没有背景)


方法二:overflow:hidden;的应用

对父类元素overflow:hidden;子元素设置背景(小竖线)之后,全部往左侧偏移(margin-left:-2px;)一个或2个像素(取决于小竖线的宽度)
此时需要对li元素进行padding-left的设置,以避免元素内容与小竖线重合失去效果,padding-left长度根据设计图显示间距为准


0 0
原创粉丝点击