在我的情况下如何设置div边框？

Question

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

我正在尝试创建像divs

一样的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在每个div上应用1 px。第二个和第三个div在顶部和底部都有思想者边界。

我无法真正更改类名，因为它是动态生成的。无论如何都可以解决这个问题吗？

非常感谢！

Answer 1

从除第一个元素之外的每个元素中删除顶部边框。

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

Here是差异的一个例子。

Answer 2

你尝试写过这样的东西：

.div {
border:1px solid  black;
border-bottom:0;
}

.div:last-child {
border-bottom:1px solid black;
}

Answer 3

尝试将此添加到您的样式中。

<style>
.div{
border: solid 1px black;
border-bottom:none;
}
.div2{
border: solid 1px black;
}
</style>

然后将其添加到您的身体：

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