Achtergrond

Deze les gaat over achtergronden. Bij CSS kun je de achtergrond een kleur geven maar ook de achtergrond van tekst en elementen op de pagina.
Eerst maar eens de achtergrond van de gehele pagina een kleur geven:
body {background-color: gray}
Je kunt ook elementen een speciale achtergrond geven zoals hier:
h1 {background-color: #00ff00}
h2 {background-color: transparent}
p {background-color: rgb(250,0,255)}
Een plaatje als achtergrond toevoegen:
body
{
background-image:
url("achtergrondplaatje.gif")
}
Het plaatje wordt nou overal herhaald op de pagina. Heb je een klein plaatje dan kun je hem zo alleen verticaal of horizontaal herhalen:
body
{
background-image:
url("achtergrondplaatje.gif");
background-repeat: repeat-y
y = Verticaal
x = Horizontaal
Voorkomen dat het plaatje herhaald wordt doe je zo:
background-repeat:
no-repeat;
En de positie van het plaatje bepaal je zo:
background-position:
center center
Netscape 4.0 ondersteund geen positie van het achtergrondplaatje. Netscape 4.0 geeft dat het plaatje bovenaan links weer. Houd daar rekening mee.
Het plaatje laten staan en de pagina laten scrollen doe je zo:
background-attachment:
fixed
Let er wel op dat Netscape 4.0 dit weer niet ondersteund. En dat het plaatje nou wel weer herhaald wordt op de pagina dus weer:
background-repeat:
no-repeat;
om het herhalen tegen te gaan.

Welke functies worden door welke versie van Internet Explorer en Netscape ondersteund:

NN: Netscape, IE: Internet Explorer