CSS background-origin Eigenschap

Definitie en gebruik

background-origin Eigenschap regelt background-position waarbij de eigenschap wordt geplaatst.

Opmerking:Als de achtergrondafbeelding van background-attachment De eigenschap is "fixed"dan heeft de eigenschap geen effect.

Zie ook:

CSS Handleiding:CSS achtergrondenCSS Achtergrond (Geavanceerd)

HTML DOM Referentie Handboek:backgroundOrigin eigenschap

Voorbeeld

Plaats de achtergrondafbeelding ten opzichte van de inhoudsbox:

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

Probeer het zelf uit

CSS Syntax

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

Eigenschapswaarde

Waarde Beschrijving Test
padding-box De achtergrondafbeelding wordt geplaatst ten opzichte van de binnenste paddingbox. Test
border-box De achtergrondafbeelding wordt geplaatst ten opzichte van de kaderbox. Test
content-box De achtergrondafbeelding wordt geplaatst ten opzichte van de inhoudsbox. Test

Technische details

Standaardwaarde: padding-box
Inheritsiviteit: no
Versie: CSS3
JavaScript Syntax: object.style.backgroundOrigin="content-box"

Browserondersteuning

Tabelnummers geven de eerste browserversie aan die de eigenschap volledig ondersteunt.

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