selectors for hover

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//self
8div.ccc:hover{
9    background-color: #00f;
10}
11
12//not self
13div.ccc:not(:hover){
14    background-color: #00f;
15}
16
17//self and pre
18div.ppp:hover div.ccc:not(:hover ~ div){
19    background-color: #00f;
20}
21//self and next
22div.ccc:hover ~div , div.ccc:hover {
23    background-color: #00f;
24
25}
26//just pre
27div.ppp:hover .ccc:not(:hover):not(:hover ~ div){
28    background-color: #00f;
29}
30//just next
31div.ccc:hover ~ div{
32    background-color: #00f;
33}