background-position-x

La propriété background-position-x définit la position horizontale initiale de l'arrière-plan par rapport à l'origine, définie background-origin, pour chaque image d'arrière-plan. Pour plus d'informations, se référer à la documentation de la propriété background-position qui existe depuis plus longtemps.

Note : La valeur de cette propriété sera surchargée par n'importe quelle déclaration avec  background ou background-position située après la déclaration de background-position-x.

Valeur initialeleft
Applicabilitétous les éléments
Héritéenon
Pourcentagesrefer to width of background positioning area minus height of background image
Médiavisuel
Valeur calculéeA list, each item consisting of: an offset given as a combination of an absolute length and a percentage, plus an origin keyword
Animablenon
Ordre canoniquel'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

/* Valeurs avec un mot-clé */
background-position-x: left;
background-position-x: right;
background-position-x: center;

/* Valeurs proportionnelles */
/* Type <percentage>        */
background-position-x: 25%;

/* Valeurs de longueur */
/* Type <length>       */
background-position-x: 0px;
background-position-x: 1cm;
background-position-x: 8em;

/* Déclaration indiquant un décalage  */
/* relatif à un des côtés de la boîte */
background-position-x: right 3px;

/* Gestion de plusieurs valeurs */
/* pour plusieurs arrières-plan */
background-position-x: 0px, center;

/* Valeurs globales */
background-position-x: inherit;
background-position-x: initial;
background-position-x: unset;

Valeurs

left
Le bord gauche de l'image d'arrière-plan est aligné avec le bord gauche de la zone dédiée à l'arrière-plan.
center
L'image d'arrière-plan est centrée horizontalement par rapport à la zone dédiée à l'arrière-plan.
right
Le côté droit de l'image d'arrière-plan est aligné avec le côté droit de la zone dédiée à l'arrière-plan.
<length>
Une valeur de longueur (type <length>) qui définit le décalage horizontal de l'arrière-plan correspondant par rapport à un bord vertical de la zone d'arrière-plan. Si aucun côté n'est indiqué, l'écart fera référence au côté gauche.
<percentage>
Une valeur en pourcentages (type <percentage>) qui définit le décalage horizontal de l'arrière-plan correspondant par rapport à un bord vertical de la zone d'arrière-plan, proportionnellement à la largeur de la zone. Si aucun côté n'est indiqué, l'écart fera référence au côté gauche.

Syntaxe formelle

[ center | [ left | right | x-start | x-end ] [ <percentage> | <length> ]? ]#

Spécifications

Spécification État Commentaires
CSS Backgrounds and Borders Module Level 4
La définition de 'background-position-x' dans cette spécification.
Brouillon de l'éditeur Spécification initiale pour les propriétés détaillées de background-position, implémentée depuis longtemps.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari
Support simple (Oui) 49.0 (49.0) 6 (Oui) (Oui)
Syntaxe avec deux valeurs (décalage depuis un côté) Pas de support 49.0 (49.0) 9 Pas de support Pas de support
Fonctionnalité Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple (Oui) 49.0 (49.0) ? ? (Oui)
Syntaxe avec deux valeurs (décalage depuis un côté) Pas de support 49.0 (49.0) ? ? Pas de support

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,