css - 如何在我的案例中设置 div 边框？

Question

我有一个关于 div 元素边框的问题

我正在尝试创建一堆 div 就像一个 table

所以

<div class='div'>first</div>
<div class='div'>second</div>
<div class='div'>third</div>
<div class='div'>four</div>

我的CSS是

.div{
border: solid 1px black;
}

我所有的 div 都有边框，但问题是我所有的 div 的顶部和底部边框都是 2 px 而不是 1px 因为我的 css 应用 1 px 在每个 div 上。第二个和第三个 div 在顶部和底部有 thinker 边框。

我真的不能更改类名，因为它是动态生成的。有没有办法解决这个问题？

非常感谢!

Answer 1

移除除第一个元素之外的所有元素的上边框。

.div {
    border-style: solid;
    border-color: black;
    border-width: 0 1px 1px 1px;
}
.div:first-child {
    border-width: 1px;
}

Here这是差异的一个例子。