css中列表中上下border叠加的问题
代码:
此时的效果是:
解决办法:
此时的效果是:
常见的场景应用:
代码:
<ul class="list-group"> <li class="list-group-item">Cras justo odio</li> <li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Morbi leo risus</li> <li class="list-group-item">Porta ac consectetur ac</li> <li class="list-group-item">Vestibulum at eros</li> </ul>
如果没有margin-top:-1px;此时的效果就是这样子的:
也可以使用margin-top来解决：
总结：
1 margin-top为负值的使用
2 margin-bottom为负值的使用