jquery - 设置具有重叠边框的 div

Question

有没有一种简单的方法可以在 div 上重叠边框？

假设你有这个:

.box {
  border: 1px solid #ccc;
  width: 50px;
  height: 50px;
}

<div class='box'></div>
<div class='box'></div>
<div class='box'></div>
<div class='box'></div>

您可以在 div 的集合处看到一个“双边框”。我只想在 div 之间显示一个 1px 边框。

我知道您可以设置不同的类，但想知道更简单的解决方案。

为什么我的问题不同好吧，我没有将 div 包裹起来的容器。因此，根据该答案，必须将 border-collapse:collapse 应用于父元素或包装元素。

Answer 1

您有几个通过 CSS 的选项。你可以这样做:

.box + .box {
    margin-top: -1px;
}

或者

.box + .box {
    border-top-width: 0px;
}