1<div className="ppp">
2<div className="ccc">a</div>
3<div className="ccc">d</div>
4<div className="ccc">r</div>
5</div>
6
7
8//self
9div.ccc:hover{
10 background-color: #00f;
11}
12
13//not self
14div.ccc:not(:hover){
15 background-color: #00f;
16}
17
18//self and pre
19div.ppp:hover div.ccc:not(:hover ~ div){
20 background-color: #00f;
21}
22//self and next
23div.ccc:hover ~div , div.ccc:hover {
24 background-color: #00f;
25
26}
27//just pre
28div.ppp:hover .ccc:not(:hover):not(:hover ~ div){
29 background-color: #00f;
30}
31//just next
32div.ccc:hover ~ div{
33 background-color: #00f;
34}
35