我有一个水平的 ul li,li 元素有一个 1 像素的黑色边框。两个相邻元素的边框为 2 像素,因为左右元素的边框已合并。
有没有什么技巧可以模拟表格的border-collapse属性来解决这个问题?
最佳答案
像这样:
<ul>
<li><a href="#">A Link</a></li>
<li><a href="#">A Link</a></li>
<li><a href="#">A Link</a></li>
<li><a href="#">A Link</a></li>
</ul>
CSS:
ul, li {
margin:0;
padding:0;
list-style:none
}
li {
float:left;
}
ul li a {
display:block;
padding:3px;
border-top:1px solid #ff0000;
border-bottom:1px solid #ff0000;
border-right:1px solid #ff0000;
}
ul li:first-child a {
border-left:1px solid #ff0000
}
关于css - 模拟水平 ul li 中的边框折叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13885268/