是：之前：兄弟姐妹之后？

Question

问题的目的是调查诸如此类行为的可能性：

＆＃13;

＆＃13;

.element:before {
  content: 'before';
  color: orange;
}

.element:after {
  content: 'after';
  color: green;
}

.element:after:hover + .element:before {
  color: red;
}

＆＃13;

<div class='element'>&nbsp;</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

兄弟组合子不能将伪元素作为目标，因为sibling combinators only represent element siblings，而不是伪元素兄弟。

所以，虽然::before和::after生成的框在布局方面是兄弟姐妹，但为了兄弟组合，它们不是。

当其::before伪元素悬停时，无法编写样式元素的::after伪元素的选择器。 （就此而言，::after:hover在选择器4之外也是无效的，并且没有实现。）有hacks使用pointer-events之类的东西，但没有任何保证适用于所有浏览器。