Style backgroundPosition attribut

Définition et utilisation

backgroundPosition Définir ou obtenir la position de l'image de fond dans l'élément.

Veuillez également consulter :

Styles HTML :Attribut background

Tutoriel CSS :Arrière-plan CSS

Tutoriel CSS3 :Arrière-plan CSS3

Manuel CSS :Attribut background-image

Manuel CSS :Attribut background-position

Exemple

Exemple 1

Modifier la position de l'image de fond :

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

Essayez-le vous-même

Exemple 2

Modifier la position de l'image de fond du <div> pour le centrage en bas :

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

Essayez-le vous-même

Exemple 3

Modifier la position de l'image de fond de l'élément <div> en 200 pixels horizontaux et 40 pixels verticaux :

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

Essayez-le vous-même

Exemple 4

Retourner la position de l'image de fond dans l'élément <div> :

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

Essayez-le vous-même

syntaxe

Retourner l'attribut backgroundPosition :

objet.style.backgroundPosition

Définir l'attribut backgroundPosition :

objet.style.backgroundPosition = value

valeur de l'attribut

valeur description
  • haut gauche
  • haut au centre
  • haut droite
  • centre gauche
  • centre au centre
  • centre droite
  • bas gauche
  • bas au centre
  • bas droite
Si vous ne spécifiez qu'un mot-clé, l'autre valeur sera "center".
x% y%

La valeur x représente la position horizontale, et la valeur y représente la position verticale.

Le coin supérieur gauche est 0% 0%. Le coin inférieur droit est 100% 100%.

Si vous ne spécifiez qu'une seule valeur, l'autre valeur est de 50%.

xpos ypos

La valeur x représente la position horizontale, et la valeur y représente la position verticale.

Le coin supérieur gauche est 0 0. Les unités peuvent être en pixels (0px 0px) ou toute autre unité CSS.

Si vous ne spécifiez qu'une seule valeur, l'autre valeur est de 50%. Vous pouvez mélanger % et unités.

initial Set this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

détails techniques

Valeur par défaut : 0% 0%
Valeur de retour : chaîne de caractères, indiquant la position de l'image de fond.
Version CSS : version CSS1

support du navigateur

backgroundPosition c'est une caractéristique de CSS1 (1996).

Tous les navigateurs le supportent pleinement :

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
supporté supporté supporté supporté supporté supporté