Maison > Questions et réponses > le corps du texte
P粉4470021272023-08-21 12:32:47
J'ai trouvé un moyen de styliser tous les éléments frères et sœurs précédents (par opposition à ~
), en fonction de vos besoins.
Supposons que vous ayez une liste de liens, lorsque vous survolez l'un des liens, tous les liens précédents devraient devenir rouges. Vous pouvez faire ceci :
/* 默认链接颜色为蓝色 */ .parent a { color: blue; } /* 前面的兄弟元素应该是红色的 */ .parent:hover a { color: red; } .parent a:hover, .parent a:hover ~ a { color: blue; }
<div class="parent"> <a href="#">链接</a> <a href="#">链接</a> <a href="#">链接</a> <a href="#">链接</a> <a href="#">链接</a> </div>
P粉9577231242023-08-21 10:52:52
Non, il n'y a pas de sélecteur "frère précédent".
Dans le même ordre d'idées, ~
是用于一般的后续兄弟选择器(意思是元素在此元素之后,但不一定紧接着之后),它是CSS3选择器。+
concerne le sélecteur de frère suivant, qui est CSS2.1.
Voir Adjacent Sibling Selector de Selector Level 3 et Adjacent Sibling Combinator de la Cascading Style Sheets version 2.1 révision 1 (CSS 2.1) spécification .