Html 列出没有重叠边框的项目

我有一个

，可以使用jQuery或诸如此类的工具动态添加到。每个

周围都有一个单独的框，基本上是一个选择器

然而，我注意到并预期每个

的底部边框都与下一个重叠。下面是一个例子：

有没有办法去掉这个？我应该使用分隔符div吗

li {
    margin-top: -1px;
    border: 1px solid red;
    padding: 10px;
}

便宜的方法你可以试试这个

li {
    border-bottom: 1px solid black;
    border-left: 1px solid;
    border-right:1px solid;
    padding: 10px;

}
li:first-child {
 border-top:1px solid black;
}

ul{
    list-style-type: none;
    margin: 0px;
}

---

用这个，我想这是为美国工作。

li{
边框：1px纯黑；
边界顶部：无；
填充：10px；
}
李：第一个孩子{
边框顶部：1件纯黑；
}

列表项
列表项
列表项
列表项

这增加了太多的分离。无论如何谢谢你！你要求它是重叠的，所以我添加了1px，它是最小的分隔符。你希望它如何显示。这是一个视觉问题。边界的厚度是2倍，而每个边界之间的厚度应该是1倍。请查看上面Warai的答案。现状：与Warai的答案一致：您将在

li

元素中使用哪些数据？只有文本？然后您可以使用

表格

和

边框折叠

属性。例如，我不想用桌子。Div是一个选项吗？检查这个。第二个答案获得了更多的选票，这是Warai的答案。所以我要和瓦莱一起去。好吧，我要了！试试这个，这对你很合适。在代码段中运行并检查