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

Auteur: Bjorn Simmering

Mijn naam is Bjorn Simmering en met deze website ga ik dus door het leven als Meneer Simmering. Ik schrijf over HTML & CSS, websites maken, WordPress en meer... Lees meer over mij »

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *