css - 第二个 div 应该使用哪种语法？

Question

<style>
.panel{
border:1px solid #000;
}
</style>

<div class="body">
    <div class="panel"></div>
    <div class="panel"></div>
</div>

我们想为第二个 div.panel 设置样式 border-top:0px;第二个 div.panel 应该使用哪种语法？

Answer 1

您可以使用 :nth-child 选择器。在这种情况下，第 n 个子值将为 2。请参见以下代码段:

.panel{
  border:1px solid #000;
}

div.panel:nth-child(2) {
  background-color: yellow;
  border-top:0px;
}

<div class="body">
    <div class="panel">a</div>
    <div class="panel">b</div>
</div>

希望对您有所帮助!!!