Tekst verbergen met CSS, het kan. Het doel van tekst te verbergen kan uiteenlopen, van een tekst te vervangen door een afbeelding omdat het juiste lettertype niet op elke computer voorkomt bijvoorbeeld.
Of tekst verbergen omdat een CMS systeem de tekst weergeeft en het niet aanwezig moet zijn omwille van het design. Reden genoeg.

Afbeeldingen kunnen op eender welk element geplaatst worden, als aanvulling, opvulling en toevoeging. Volgende manieren tonen je welke mogelijkheden er zijn.

Als je een afbeeldingen hebt waarvan de afmetingen altijd vooraf gekend zijn is het relatief eenvoudig om deze te centreren te opzichte van het parent element. Maar wat als je de afmetingen niet vanop voorhand weet, of dat de afmetingen niet altijd hetzelfde zijn??
Met volgende CSS Snippet kan je dit probleem oplossen.

De illusie criëeren van een schaduw op bepaalde elementen is niets nieuws meer, het kan op verschilende manieren worden verkregen, maar toch wel hoofdzakelijk met afbeelding(en).
Deze versie gaat een stapje verder, probeer het maar eens uit.

Of je nu CSS of Javascript gebruikt, een achtergrondafbeelding bij een link zal meestal dan pas geladen worden als ze nodig is , bij het hoveren en dit kan soms een vertraging opleveren, en JavaScript preloaden is tegenwoordig geen optie meer.
De oplossing is één afbeelding te gebruiken die alle “states” reeds bevat, en bij hover verander je de afbeelding van plaats, dus geen vertraging meer.