Attribut background-origin CSS

Définition et utilisation

background-origin Définition de l'attribut background-position À quelle position l'attribut est-il positionné par rapport à.

Remarque :Si l'image de fond est background-attachment L'attribut est «fixed« , alors cette propriété n'a aucun effet.

Veuillez également consulter :

Tutoriel CSS :arrière-plan CSSetArrière-plan CSS (avancé)

Manuel de référence HTML DOM :Attribut backgroundOrigin

Exemple

Positionner l'image de fond par rapport à la boîte de contenu :

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

Essayer vous-même

Syntaxe CSS

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

Valeur de l'attribut

Valeur Description Test
padding-box L'image de fond est positionnée par rapport à la boîte de marge interne. Test
border-box L'image de fond est positionnée par rapport à la boîte de bord. Test
content-box L'image de fond est positionnée par rapport à la boîte de contenu. Test

Détails techniques

Valeur par défaut : padding-box
Héritabilité : non
Version : CSS3
Syntaxe JavaScript : object.style.backgroundOrigin="content-box"

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur prenant en charge cette propriété en pleine mesure.

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