Obnovenie základného odkazu ako CSS Sprite Triky CSS

Anonim
a ( background: url(sprite.png.webp) no-repeat; display: block; height: 30px; width: 250px; ) a:hover ( background-position: 0 -30px; )

Nastavená výška a šírka zaisťuje, že sa zobrazí iba časť grafiky sprite.png.webp. Prejdením myši sa posunie poloha obrázka na pozadí a odhalí sa iná oblasť grafiky.

Pozrite si pero KBjZwg od Geoffa Grahama (@geoffgraham) na serveri CodePen.