两个元素突出自己和彼此

Question

有两个要素。当我突出显示任何一个元素时，我希望他们两个进入阶段。我试图使用通用兄弟运算符（〜）来完成此任务。但是，似乎这只适用于一个案例。问题在my website上说明。当您将鼠标悬停在day元素的单词上时，它是唯一突出显示的元素。这个兄弟运算符似乎只处理html中foo之后声明的元素，如div.foo ~ .bar这样的兄弟标记我会如何向后执行此操作？

用于定相的CSS

div.lisWrap:hover ~.wordSpace, .lisWrap:hover{ //works
    opacity: .8;
    transition: all 1.5s ease;
}

div.wordSpace:hover ~.lisWrap, .wordSpace:hover{ //doesnt work
    opacity: .8;
    transition: all 1.5s ease;
}

Answer 1

~组合子分隔两个选择器，并且仅当第一个元素前面有第二个元素时才匹配第二个元素，并且它们共享一个共同的父元素。来自https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_selectors

在CSS中，您无法寻址前一个或父元素。这是一种法律。

更好的方法是获取：将鼠标悬停在包含两个元素的元素上。