a ( background: url(sprite.png.webp) no-repeat; display: block; height: 30px; width: 250px; ) a:hover ( background-position: 0 -30px; )Den inställda höjden och bredden säkerställer att endast en del av sprite.png.webp-grafiken visas. Överrullningen förskjuter bakgrundsbildens position och avslöjar ett annat område i grafiken.
Se pennan KBjZwg av Geoff Graham (@geoffgraham) på CodePen.