如何为除首个.tab元素外的所有元素应用CSS样式？

咱们先拆解问题根源，再给你能直接生效的解决方案：

为啥你之前的选择器都失效了？ #

你的HTML结构里，每个.tab都被独立的<access>标签包裹着——它们既不是同一个父元素下的相邻兄弟，也不是.tabs的直接子元素，所以之前的写法都踩了逻辑坑：

• .tab + .tab：这是相邻兄弟选择器，要求两个.tab必须是同一个父元素下的相邻节点，但你的每个.tab都有自己的<access>父元素，根本不相邻，自然选不到任何元素。
• .tabs .tab:not(:first)：首先:first不是合法的CSS伪类，正确写法是:first-child；但就算改了，每个.tab都是自己父元素<access>的第一个子元素，所有.tab都会被排除，等于没选中任何内容。
• .tabs:not(:first)：这个选择器是在选不是第一个的.tabs元素本身，完全没涉及到内部的.tab，当然不会生效。

正确的实现方式 #

根据你的HTML结构，我们需要先定位到.tabs下除第一个之外的所有<access>，再选中里面的.tab，有两种靠谱写法：

写法一：使用:not(:first-child) #

.tabs access:not(:first-child) .tab {
  margin: 0 0 0 20px;
}

逻辑拆解：

1. 找到.tabs下的所有<access>元素
2. 排除掉第一个<access>
3. 选中剩下<access>里的.tab元素

写法二：使用通用兄弟选择器~ #

.tabs access:first-child ~ access .tab {
  margin: 0 0 0 20px;
}

逻辑拆解：

1. 定位.tabs下的第一个<access>
2. 选中它之后的所有同级<access>元素
3. 选中这些<access>里的.tab元素

这两种写法都能精准命中你需要的元素，直接替换之前的CSS就能生效啦～

内容的提问来源于stack exchange，提问作者User 5842