Accueil    CSS    Propriété Background-image
 



style css background-image  Style CSS background-image

«  Partie précédente  |  Index  |  Partie suivante  »


La propriété background-image permet de faire référence au fichier image qui servira d'arrière plan à un élément. Le simple fait de définir cette propriété entrainera directement l'affichage de l'image qui sera positionnée par défaut en haut à gauche de l'élément et sera également dupliquée par défaut.

Lorsque la référence au fichier image est faite, il faut bien tenir compte du chemin relatif de l'image par rapport à la page qui l'utilisera. Si ces deux éléments ne sont pas dans le même dossier il faut fournir le chemin relatif entre la page et l'image.

Si la page html se trouve dans le dossier test/test.html et que l'image est dans le dossier test/images/image.png, le chemin relatif à utiliser est :
"background-image : url(images/image.png)"



Propriétés pour le style background-image :




Propriété Définition Valeurs CSS
background-image Défini une référence vers une image utilisée comme arrière plan qui sera par défaut positionnée dans le coin haut gauche de celui-ci URL CSS 1


Exemple d'utilisation du style css background-image :





<div style="border:solid 1px black; width:400px; height:200px;
   background-image:url(exemples/exemple-css-image.png);
   background-repeat:no-repeat; background-position:center center;">
   Définition d'une image de fond centrée en arrière plan
</div>



Définition d'une image de fond centrée en arrière plan