hover.html:
<!doctype html>
<html>
<head>
<title>CSS Hover</title>
<link rel="stylesheet" href="hover.css">
</head>
<body>
<div class="container">
<span class="color-black">Black</span>
<span class="color-red">Red</span>
<span class="color-green">Green</span>
<div class="image"></div>
</div>
</body>
</html>
hover.css:
div.image {
width: 100px;
height: 75px;
}
span.color-black:hover ~ div.image {
background-image: url(black.png);
}
span.color-red:hover ~ div.image {
background-image: url(red.png);
}
span.color-green:hover ~ div.image {
background-image: url(green.png);
}
