background-repeat

Wanneer je een plaatje als achtergrond gebruikt dan wordt dit plaatje over de hele achtergrond geplaatst. Wanneer het kleiner is dan het scherm, dan herhaalt het plaatje zich horizontaal (repeat-x) en verticaal (repeat-y).

De waarden van background-repeat

Er zijn 5 waarden voor dit CSS element. Te weten repeat, repeat-x, repeat-y, no-repeat en inherit. Deze laatste is de overerving. De waarde van een eerder element wordt dan overgenomen.

Bij repeat wordt het achtergrondplaatje horizontaal en verticaal herhaalt. Met repeat-x wordt het plaatje alleen horizontaal herhaalt. Voor repeat-y geldt hetzelfde, maar dan in verticale richting.

no-repeat gebruik je om het achtergrondplaatje een keer te laten verschijnen. Het plaatje wordt niet herhaald.

Standaardinstelling

De standaardinstelling van background-repeat is repeat.

Voorbeelden

body {background-repeat: no-repeat;}
p {background-repeat: repeat-x;}
p.stop {background-repeat: repeat-y;}
In deze div wordt het plaatje horizontaal herhaalt totdat het vak vol is. Repeat-x
In deze div wordt het plaatje verticaal herhaalt totdat het vak vol is. Repeat-y

html en css voor beginnersWil jij ook leren hoe je je eigen website kunt maken?

Wil jij tips en tricks om zo goed mogelijk zelf met alles aan de slag te kunnen?
Meld je hieronder aan voor de HTML-site nieuwsbrief en krijg elke week handige tips om een website te bouwen.
En je ontvangt meteen mijn GRATIS ebook HTML & CSS voor Beginners.

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.