虽然没有以前的CSS选择器。我找到了一个快速而简单的方法来自己选择一个。以下是HTML标记：

<div class="parent">
    <div class="child-1"></div>
    <div class="child-2"></div>
</div>

在JavaScript中，只需执行以下操作：

document.querySelector(".child-2").parentElement.querySelector(".child-1")

这将首先选择父div，然后从child-2 div中选择child-1 div。

如果您使用jQuery，只需执行以下操作：

$(".child-2").prev()

这是类似问题的链接

CSS选择所有以前的兄弟姐妹以获得星级

因此，我使用每个人的回答来发布我的解决方案，任何人都可以将其作为参考，并可能提出改进建议。

//仅用于检查输入值//Consts公司const starRadios=document.querySelectorAll（'input[name=“rating”]'）；//事件监听器starRadios.forEach（（radio）=>radio.addEventListener（'change'，getStarRadioValue））；//获取星形无线电值函数getStarRadioValue（事件）｛警报（event.target.value）//用它做点什么};.星级{字体大小：1.5rem；unicode bidi：bidi覆盖；方向：rtl；文本对齐：左侧；}.star-rating.editable标签：悬停{光标：指针；}.star-rating.editable.icon星形：悬停，.star-rating.editable.icon星形：悬停~.icon星形{背景色：#fb2727！重要的}.icon星形{位置：相对；背景色：#72747d；宽度：32px；高度：32px；显示：内联块；过渡：背景色0.3s；}.icon-star填充{背景色：#fb2727；}.icon星形>标签{显示：内联块；宽度：100%；高度：100%；左：0；顶部：0；位置：绝对；}.icon star>标签>输入[类型=“radio”]{位置：绝对；顶部：0；左：0；变换：translateY（50%）translateX（50%）；显示：无；}<div class=“星级可编辑”><span class=“icon star”><标签><input type=“radio”name=“rating”value=“5”/></label></span><span class=“icon star”><标签><input type=“radio”name=“rating”value=“4”/></label></span><span class=“icon star”><标签><input type=“radio”name=“rating”value=“3”/></label></span><span class=“icon star”><标签><input type=“radio”name=“rating”value=“2”/></label></span><span class=“icon star”><标签><input type=“radio”name=“rating”value=“1”/></label></span></div>

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

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

传统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>

我找到了一种方法来设计所有以前的兄弟姐妹（与~相反），这取决于你需要什么。

假设你有一个链接列表，当你悬停在一个链接上时，之前的所有链接都应该变成红色。你可以这样做：

/*默认链接颜色为蓝色*/.父级a{颜色：蓝色；}/*上一个兄弟姐妹应该是红色的*/.parent:悬停{颜色：红色；}.父项a：悬停，.父a:悬停~a{颜色：蓝色；}<div class=“parent”><a href=“#”>链接</a><a href=“#”>链接</a><a href=“#”>链接</a><a href=“#”>链接</a><a href=“#”>链接</a></div>

虽然没有以前的CSS选择器。我找到了一个快速而简单的方法来自己选择一个。以下是HTML标记：

<div class="parent">
    <div class="child-1"></div>
    <div class="child-2"></div>
</div>

在JavaScript中，只需执行以下操作：

document.querySelector(".child-2").parentElement.querySelector(".child-1")

这将首先选择父div，然后从child-2 div中选择child-1 div。

如果您使用jQuery，只需执行以下操作：

$(".child-2").prev()

我找到了最简单的解决方案。它可能只适用于你正在做的事情。

假设您想将鼠标悬停在“sibling_2”上以更改以下示例中的“sibling_1”：

<div class='parent'><div class='sibling_1'></div><div class='sibling_2'></div></div>

由于没有以前的元素选择器，您可以简单地切换“sibling_1”和“sibling_2”并应用，使它们看起来相同。

.父级{显示：柔性；弯曲方向：行反转；}

现在您可以这样选择它们。.sibling_1：悬停~.sibling_2{#您的CSS}