CSSLeren.nl Begrippen Background-Position

Background-Position

Het begrip background-position geeft aan bepaalt de beginpositie van de achtergrondafbeelding.

Toepassen op:	Alles
Beginwaarde:	0
Waarden:	[lengte], [precentage], top, bottom, left, right, center, inherit

De achtergrond afbeelding positie kan op meerdere manieren worden aangegeven, met een waarde of met twee waardes. Als er twee waardes zijn moet je ze scheiden met een spatie.

Met een precentage en/of lengte. Als je een waarde opneemt geld die voor horizontaal en zal verticaal op 50% staan of met twee waardes en dan zal de eerste voor horizontaal zijn en de tweede verticaal. Het is mogelijk om een waarde in precentages te doen en de ander in lengte.
Met een of meerdere woorden, top, bottom, left, right en center. Als enkel horizontaal of enkel verticaal is aangegeven dan zal hij voor de andere dimensie 50% nemen.

Voorbeeld:

background-position: top right;

background-position: 100px 0%;

background-position: 20% 30%;

[lengte]	Het beste is om een lengte te gebruiken en dan in pixels, dit omdat de grote dan in iedere browser exact hetzelfde is. Bij gebruik van bijvoorbeeld "em" of "pt" verschilt het per browser, bij pixels niet. Als er maar een waarde wordt gegeven geldt die voor de horizontale demensie, verticaal komt dan op 50%.
[precentage]	Met een precentage wordt het precentage genomen bekeken van de grote van het element. Als er maar een waarde wordt gegeven geldt die voor de horizontale demensie, verticaal komt dan op 50%.
top	De achtergrondafbeelding wordt naar boven uitgelijnd. Als er geen horizontale dimensie is aangegeven zal die 50% worden.
bottom	De achtergrondafbeelding wordt naar beneden uitgelijnd. Als er geen horizontale dimensie is aangegeven zal die 50% worden.
left	De achtergrondafbeelding wordt naar links uitgelijnd. Als er geen verticale dimensie is aangegeven zal die 50% worden.
right	De achtergrondafbeelding wordt naar rechts uitgelijnd. Als er geen verticale dimensie is aangegeven zal die 50% worden.
center	Het midden van het achtergrondplaatje komt in het midden van het element. Als center alleen staat heeft het betrekking op bijde dimensies
inherit	De waarde van het boven liggende element wordt aangehouden.