CSS background-origin ominaisuus

Määritelmä ja käyttö

background-origin Ominaisuus määrittelee background-position Ominaisuus sijoittaa taustakuvan suhteessa mihin?

Huomautus:Jos taustakuvan background-attachment Ominaisuus on "fixedJos suluja ei ole, ominaisuus ei vaikuta.

Katso myös:

CSS oppitunnit:CSS taustajaCSS tausta (edistynyt)

HTML DOM viittomakirja:backgroundOrigin ominaisuus

Esimerkki

Sijoita taustakuva suhteessa sisällön kehykseen:

div
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-position:left;
background-origin:content-box;
}

Kokeile itse

CSS kieli

background-origin: padding-box|border-box|content-box;

Ominaisuuden arvo

Arvo Kuvaus Testi
padding-box Taustakuva sijoitetaan suhteessa sisennyksen kehykseen. Testi
border-box Taustakuva sijoitetaan suhteessa reun kehykseen. Testi
content-box Taustakuva sijoitetaan suhteessa sisällön kehykseen. Testi

Tekninen yksityiskohta

Oletusarvo: padding-box
Perintä: ei
Versio: CSS3
JavaScript kieli: object.style.backgroundOrigin="content-box"

Selaimen tuki

Taulukon numerot osoittavat ensimmäisen selaimen version, joka tukee ominaisuutta täysin.

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
4.0 9.0 4.0 3.0 10.5