/ Code Css background-image | Résultat du code Css background-image | Copie d'écran / J'ai vu une erreur dans cette page

Exemple de code de la propriété CSS background-image.

<style type="text/css">
.exemple-background-image-0{
  : url(/img/exemple/background-image-ciel.gif); 
}
.exemple-background-image-1{
  : url(/img/screenshot_css/f_background.gif); 
}


.exemple-background-images-1{
  : url(/img/exemple/filter-image-1.png); 
  : red; 
 width : 150px; height : 150px; color : #fff; 
}

.exemple-background-images-2{
  : url(/img/exemple/background-image-silouhette.png), url(/img/exemple/background-image-fenetre.png), url(/img/exemple/background-image-ciel.gif) ; 
  : repeat-x, no-repeat, repeat ; 
}

.exemple-background-images-3{
  : url(/img/exemple/background-image-silouhette.png), url(/img/exemple/background-image-fenetre.png), linear-gradient(to bottom, #e1ffff 0%,#e1ffff 7%,#e1ffff 12%,#fdffff 12%,#e6f8fd 30%,#c8eefb 54%,#bee4f8 75%,#b1d8f5 100%); 
  : repeat-x, no-repeat, repeat ; 
}

.exemple-background-images-4{
  : url(/img/exemple/filter-image.jpg); 
  : red; 
 width : 150px; height : 150px; 
}
.exemple-background-images-4:hover{
  : none; 
}

.exemple-multi{
 width : 197px; 
 height : 250px; 
 background-color : #000; 
}
.exemple-multi, .exemple { margin-bottom : 5px; }
table.exemple{ padding : 30px; }
table.exemple, table.exemple td{border : 1px solid #000}
</style>
Images d'arrière-plan sur un tableau et une cellule : 
<table width="100" border="0" cellspacing="0" cellpadding="0" class="exemple exemple-background-image-0">
 <tr>
  <td nowrap class="exemple-background-image-1">
<br><br>
background-image:url(background.gif)</font>
<br><br>
</td>
 </tr>
</table>
Image avec zone transparente :
<div class="exemple exemple-background-images-1"> Image avec zone transparente </div>
Avec plusieurs images d'arrière-plan :
<div class="exemple-multi exemple-background-images-2"></div>
Avec plusieurs images d'arrière-plan et dégradé :
<div class="exemple-multi exemple-background-images-3"></div>
Suppression de l'image d'arrière-plan au survol du curseur : 
<div class="exemple exemple-background-images-4"></div>
Voir de code background-image dans :

Interprétation du code de la propriété background-image CSS par votre navigateur.

Images d'arrière-plan sur un tableau et une cellule :


background-image:url(background.gif)

Image avec zone transparente :
Image avec zone transparente
Avec plusieurs images d'arrière-plan :
Avec plusieurs images d'arrière-plan et dégradé :
Suppression de l'image d'arrière-plan au survol du curseur :

Interprétation normale du code de la propriété CSS background-image (copie d'écran).

copie d'écran de l'affichage de la propriété CSS background-image


Aller en haut de la page

Vos paramètres de cookies

Ce site utilise des cookies pour améliorer votre expérience utilisateur et optimiser le fonctionnement du site.
Des contenus publicitaires vous sont aussi présentés, ainsi que cookies de partages sur les réseaux sociaux.

Vous pouvez accepter ces cookies en cliquant sur « Autoriser tous les cookies », cliquer sur « Paramétrer les cookies » pour gérer vos préférences de cookies.