Style backgroundPosition egenskab

Definition og brug

backgroundPosition Indstil eller returner placeringen af baggrundsbilledet i elementet.

Se også:

HTML styling:background egenskab

CSS tutorial:CSS baggrund

CSS3 tutorial:CSS3 baggrund

CSS reference manual:background-image egenskab

CSS reference manual:background-position egenskab

Eksempel

Eksempel 1

Ændr placeringen af baggrundsbilledet:

document.body.style.backgroundPosition = "top right";

prøv det selv

Eksempel 2

Sæt placeringen af baggrundsbilledet i <div>-elementet til midten af bunden:

document.getElementById("myDiv").style.backgroundPosition = "center bottom";

prøv det selv

eksempel 3

Ændr placeringen af baggrundsbilledet i <div>-elementet til 200 pixels horisontalt og 40 pixels vertikalt:

document.getElementById("myDiv").style.backgroundPosition = "200px 40px";

prøv det selv

eksempel 4

Returner placeringen af baggrundsbilledet i <div>-elementet:

document.getElementById("myDiv").style.backgroundPosition; 

prøv det selv

syntaks

Returner backgroundPosition-egenskaben:

object.style.backgroundPosition

Indstil backgroundPosition-egenskaben:

object.style.backgroundPosition = value

egenskabsværdi

værdi beskrivelse
  • øverst venstre
  • øverst midte
  • øverst højre
  • midte venstre
  • midte midte
  • midte højre
  • nederst venstre
  • nederst midte
  • nederst højre
Hvis du kun angiver én nøgleord, vil den anden værdi være "center".
x% y%

x-værdien angiver den horisontale placering, y-værdien angiver den vertikale placering.

Øverst til venstre er 0%. Nederst til højre er 100% 100%.

Hvis du kun angiver én værdi, vil den anden værdi være 50%.

xpos ypos

x-værdien angiver den horisontale placering, y-værdien angiver den vertikale placering.

Øverst til venstre er 0 0. Enheder kan være pixels (0px 0px) eller enhver anden CSS-enhed.

Hvis du kun angiver én værdi, vil den anden værdi være 50%. Du kan blande brug af % og enheder.

initial Sæt denne egenskab til dens standardværdi. Se initial.
inherit Arv denne egenskab fra sin forældre element. Se inherit.

tekniske detaljer

Standardværdi: 0% 0%
Returværdi: en streng, der angiver placeringen af baggrundsbilledet.
CSS version: CSS1

browser understøttelse

backgroundPosition er en CSS1 (1996) egenskab.

alle browsere understøtter det fuldt ud:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
støtter støtter støtter støtter støtter støtter