Attribut background-image CSS

Définition et utilisation

background-image L'attribut définit l'image de fond de l'élément.

Le fond de l'élément occupe toute la taille de l'élément, y compris la marge interne et la bordure, mais pas la marge externe.

Par défaut, l'image de fond est située dans le coin supérieur gauche de l'élément et est répétée dans les directions horizontale et verticale.

Astuce :Veuillez définir une couleur de fond disponible, de sorte que si l'image de fond n'est pas disponible, la page peut obtenir une bonne apparence visuelle.

Explication détaillée

L'attribut background-image définit une image dans le fond de l'élément.

Selon background-repeat les valeurs de l'attribut, l'image peut être répétée sans fin, répétée le long d'un axe (axe x ou axe y), ou ne pas être répétée du tout.

L'image de fond initiale (image originale) est basée sur background-position Placement des valeurs de l'attribut.

Voir également :

Tutoriel CSS :Arrière-plan CSS、Arrière-plan CSS (avancé)、Dégradé CSS

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

Exemple

Définir l'image comme arrière-plan de la page :

body
  { 
  background-image: url(bgimage.gif);
  background-color: #000000;
  }

Essayez-le vous-même

Syntaxe CSS

background-image : url|none|initial|hérité;

Valeur de l'attribut

Valeur de l'attribut

Valeur Description
url('URL) Chemin vers l'image.
aucune Valeur par défaut. Ne montre pas d'image de fond.
hérité Définit que la propriété background-image doit être héritée de l'élément parent.

Détails techniques

Valeur par défaut : aucune
Héritabilité : non
Version : CSS1
Syntaxe JavaScript : object.style.backgroundImage="url(stars.gif)"

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge cette propriété en totalité.

Chrome Edge Firefox Safari Opera
Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5