P粉9532317812023-08-28 10:42:01
In this specific example you can use:
#container:hover #cube { background-color: yellow; }
This example only works if cube
is a child of container
. For more complex scenarios, you'll need to use different CSS, or use JavaScript.
P粉6337331462023-08-28 00:09:44
If the cube is directly inside the container:
#container:hover > #cube { background-color: yellow; }
If the cube is located next to the container (after the container's closing tag):
#container:hover + #cube { background-color: yellow; }
If the cube is located somewhere inside the container:
#container:hover #cube { background-color: yellow; }
If the cube is a sibling of the container:
#container:hover ~ #cube { background-color: yellow; }