解包元素

Question

<div class="tabs">
  <div class="title">A</div>
  <div class="title">B</div>
  <div class="content">Something</div>
</div>

如何在不重构我的html的情况下选择B标题，并且可能会添加C，D，E和更多标题。我在下面尝试了css它不起作用

Answer 1

使用nth-child和nth-of-type选择器。根据您的需要选择以下任何一种。

解决方案：1

.tabs :nth-child(2){
  color:red;
}

解决方案：2

.tabs .title:nth-child(2){
  color:red;
}

解决方案：3

.tabs .title:nth-of-type(2){
  color:red;
}

Answer 2

.tabs .title:nth-child(2) {
    color : green;
}