更新时间：2020-06-08 16:59:12
原创,专业,图文
施用CSS实现间隔线竖线 -
施用,CSS,实现,间隔,竖线
今日头条,最新,最好,最优秀,最靠谱,最有用,最好看,最有效,最热,排行榜,最牛,怎么办,怎么弄,解决方案,解决方法,怎么处理,如何处理,如何解决
使用css实现间隔线|(竖线)
是不是考虑用这个？
我们来看看taobao和paipai对这块的实现，这两个站首页罗例产品分类时，都使用了这种样式：
paipai的实现
a{
border-left: 1px solid #d9d9d9;
margin-left: -1px;
padding-left: 5px;
}
taobao的实现：
a{
border-left: 1px solid #b7d0e4;
display: inline-block;
margin-left: -1px;
padding: 0px 0px 0px 3px;
}
现在你会了吗？
这段css很巧妙的将margin-left设为-1，将第一个border隐藏了起来，而且兼容所有的主流浏览器。这样，就不用给第一个或者最后一个样式做特殊样式处理了。如果间隔需要大些，可以很方便的通过设置padding-left和padding-right来控制。
原创,专业,图文
施用CSS实现间隔线竖线 -
施用,CSS,实现,间隔,竖线
今日头条,最新,最好,最优秀,最靠谱,最有用,最好看,最有效,最热,排行榜,最牛,怎么办,怎么弄,解决方案,解决方法,怎么处理,如何处理,如何解决
