没有这样的选择器，但在DOM API中有一个非常只读的属性

Node.previousSibling节点

没有，也有。

如果必须在输入之前放置标签，只需在输入之后放置标签，并将标签和输入保持在一个div中，并按如下方式设置div的样式：

.输入框{显示：柔性；弯曲方向：列反转；}<div class=“input box”><输入id=“电子邮件”class=“表单项”/><label for=“email”class=“表单项标题”>电子邮件*</label></div>

现在，您可以应用css中提供的标准下一个同级样式选项，并且它看起来就像您使用的是上一个同级的样式。

没有“前一选择器”，但可以使用：not和~（“后选择器”）的组合。没有逆序，没有javascript。

.父级a{颜色：蓝色}.父项a.活动{颜色：红色}.parent a：不是（.parent a.active~a）{颜色：红色}<div class=“parent”><a href=“”>链接</a><a href=“”>链接</a><a href=“”class=“active”>链接</a><a href=“”>链接</a><a href=“”>链接</a></div>

我认为我的方法比“设置所有div的样式，而不是删除div之后的样式”，或者使用javascript，或者使用相反的顺序更直接。

根据您的确切目标，有一种方法可以在不使用父选择器的情况下实现父选择器的有用性（即使存在）。。。

假设我们有：

<div>
  <ul>
    <li><a>Pants</a></li>
    <li><a>Socks</a></li>
    <ul>
      <li><a>White socks</a></li>
      <li><a>Blue socks</a></li>
    </ul>
  </ul>
</div>

我们可以做什么来使用间距使袜子块（包括袜子颜色）在视觉上突出？

什么会很好，但不存在：

ul li ul:parent {
  margin-top: 15px;
  margin-bottom: 15px;
}

存在的内容：

li > a {
  margin-top: 15px;
  display: block;
}
li > a:only-child {
  margin-top: 0px;
}

这将所有锚链接设置为顶部有15px的边距，并将其重置为0，以用于LI中没有UL元素（或其他标签）的链接。

+是给下一个兄弟姐妹的。是否有与前一个相同的兄弟姐妹

您可以使用两个斧头选择器：！和

传统CSS中有两个后续的同级选择器：

+是紧接其后的同级选择器~是任何后续的同级选择器

在传统的CSS中，没有以前的同级选择器。

然而，在axe CSS后处理器库中，有两个先前的同级选择器：

? 是前一个同级选择器（与+相反）! 是之前的任何同级选择器（与~相反）

工作示例：

在以下示例中：

.any后续：hover~div选择任何后续div立即后续：hover+div选择立即后续div.任何以前的：悬停！div选择之前的任何div.上一个：悬停？div选择上一个div

第二部分{显示：内联块；宽度：60px；高度：100px；颜色：rgb（255、255、255）；背景色：rgb（255，0，0）；文本对齐：居中；垂直对齐：顶部；光标：指针；不透明度：0；过渡：不透明度0.6s缓和；}代码{显示：块；边距：4px；字体大小：24px；线条高度：24px；背景色：rgba（0、0、0和0.5）；}div：第n个类型（-n+4）{背景色：rgb（0，0，255）；}div：第n种类型（n+3）：第n个类型（-n+6）{不透明度：1；}.any后续：hover~div，.紧随其后：hover+div，.任何以前的：悬停！div中，.上一个：悬停？第二部分{不透明度：1；}<h2>将鼠标悬停在下面的任何块上</h2><div></div><div></div>＜div class=“immediate previor”＞悬停＜code＞</代码>选择器</div>＜div class=“any previous”＞悬停＜code＞</代码>选择器</div><div class=“any后续”>悬停<code>~</code>选择器</div><div class=“immediate后续”>悬停<code>+</code>选择器</div><div></div><div></div><script src=“https://rouninmedia.github.io/axe/axe.js“></script>

我需要一个解决方案来选择上一个兄弟tr。我使用React和Styled组件提出了这个解决方案。这不是我的确切解决方案（这是几小时后的记忆）。我知道setHighlighterRow函数存在缺陷。

OnMouseOver一行会将行索引设置为state，并使用新的背景色重新阅读前一行

class ReactClass extends Component {
  constructor() {
    this.state = {
       highlightRowIndex: null
    }
  }

  setHighlightedRow = (index) => {
    const highlightRowIndex = index === null ? null : index - 1;
    this.setState({highlightRowIndex});
  }

  render() {
    return (
       <Table>
        <Tbody>
           {arr.map((row, index) => {
                const isHighlighted = index === this.state.highlightRowIndex
                return {
                    <Trow 
                        isHighlighted={isHighlighted}
                        onMouseOver={() => this.setHighlightedRow(index)}
                        onMouseOut={() => this.setHighlightedRow(null)}
                        >
                        ...
                    </Trow>
                }
           })}  
        </Tbody>   
       </Table>
    )
  }
}

const Trow = styled.tr`
    & td {
        background-color: ${p => p.isHighlighted ? 'red' : 'white'};
    }

    &:hover {
        background-color: red;
    }
`;