Style backgroundPosition ominaisuus

Määrittely ja käyttö

backgroundPosition Aseta tai palauta taustakuvan sijainti elementissä.

Katso myös:

HTML-tyyli:background ominaisuus

CSS oppituntiohjelma:CSS-aulatausta

CSS3 oppituntiohjelma:CSS3 tausta

CSS viittomakirja:background-image ominaisuus

CSS viittomakirja:background-position ominaisuus

Esimerkki

Esimerkki 1

Muuta taustakuvan sijainti:

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

Kokeile itse

Esimerkki 2

Muuta <div>-elementin taustakuvan sijainti keskelle alhaalta:

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

Kokeile itse

Esimerkki 3

Muuta <div>-elementin taustakuvan sijainti horisontaalisesti 200 pikseliä ja vertikaalisesti 40 pikseliä:

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

Kokeile itse

Esimerkki 4

Palauttaa <div>-elementin taustakuvan sijainnin:

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

Kokeile itse

syntaksi

Palauta backgroundPosition-ominaisuus:

object.style.backgroundPosition

Aseta backgroundPosition-ominaisuus:

object.style.backgroundPosition = value

ominaisuusarvo

arvo kuvaus
  • top left
  • top center
  • top right
  • center left
  • center center
  • center right
  • right top
  • right center
  • right bottom
 Jos määrittelet vain yhden avainsanan, toinen arvo on "center".
x% y%

x-arvo ilmaisee horisontaalisen sijainnin, y-arvo vertikaalisen sijainnin.

vasen yläkulma on 0% 0%. oikea alakulma on 100% 100%.

Jos määrittelet vain yhden arvon, toinen arvo on 50%.
xpos ypos

x-arvo ilmaisee horisontaalisen sijainnin, y-arvo vertikaalisen sijainnin.

vasen yläkulma on 0 0. Yksikkö voi olla pikseli (0px 0px) tai mikä tahansa muu CSS-yksikkö.

Jos määrittelet vain yhden arvon, toinen arvo on 50%. Voit käyttää sekä % että yksikköjä.
initial Aseta tämä ominaisuus sen oletusarvoon. Katso initial.
inherit Perii tämän ominaisuuden vanhemmalta elementiltä. Katso inherit.

Tekninen yksityiskohta

Oletusarvo: 0% 0%
Palautusarvo: merkkijono, joka ilmaisee taustakuvan sijainnin.
CSS versioona: CSS1

selaimen tuki

backgroundPosition on CSS1 (1996) ominaisuus.

Kaikki selaimet tukevat sen täysin:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
tukee tukee tukee tukee tukee tukee