Skriv på billedet
Sat på siden 24-09-2004
Vil du have en tekst hen over billedet på hjemmesiden? Fx en knap-tekst?
Under normale omstændigheder vil du skulle starte et billedbehandlingsprogram og skrive hen over billedet. Hvis du fx har en del ens knapper, så er dette et stort arbejde.
Spar tid med stylesheets!
Se et eksempel på brugen på siden http://www.tips-og-tricks.com/eksempler/tekstbillede.html -- du vil måske endda synes, at billedet er sjovt ;-)
Du skal blot indsætte følgende kode og tilpasse den til eget brug, dvs. ændre billedets navn, dets placering og størrelse, og ændre tekstens placering og ordlyd. Jeg har valgt hvid tekst i eksemplet, fordi billedet havde en sort baggrund.
<div style="position: relative;"> <img src="bryllup.jpg" width="400" height="300" alt="Dansk bryllup i Paris"> <h3 style="position: absolute; left: 5px; top: 270px; color: white; font: bold 14px Arial, Helvetica, sans-serif;">Dansk bryllup i Paris</h3> </div>
Obs! Metoden har ydermere en fordel i forbindelse med søgerobotter. Tekst, der indgår i billeder, læses ikke af søgerobotterne. Det er denneher tekst imidlertid, eftersom det er en almindelig tekst, der er indsat ved hjælp af CSS.