body {
background-color: darkgoldenrod;
}
#tile {
width: 32px;
height: 32px;
}
#square1::before {
content: url("../image1.jpg");
position: absolute;
}
#square1::after {
content: url("../image2.jpg");
position: absolute;
}
#square1:hover::after {
content: '';
}
<body>
Begin welcome.
<div id="tile">
<div id="square1"></div>
</div>
End welcome.
</body>
Przed najechaniem na obrazek , po najechaniu .
http://blog.eduweb.pl/pseudo-elementy-before-i-after-w-css/