« Le langage CSS/Fonds, bordures, marges et espacements » : différence entre les versions

Contenu supprimé Contenu ajouté
Ligne 136 :
</div>
|}
 
Il est possible d'utiliser plus de deux couleurs, chacune étant suivie de la position relative dans le dégradé.
 
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, rgb(255,0,0), rgb(255,255,255) 25%, rgb(0,255,255) 50% ,rgb(0,0,0));
</syntaxhighlight>
 
<div style="text-align:center; padding: 3em 0; background-image: linear-gradient(to right, rgb(255,0,0), rgb(255,255,255) 25%, rgb(0,255,255) 50% ,rgb(0,0,0));">
Le fond en dégradé.
</div>
 
La position peut aussi être spécifiée pour la première et la dernière couleurs :
 
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, rgb(200,200,200) 35%, rgb(0,100,200) 65%);
</syntaxhighlight>
 
<div style="text-align:center; padding: 3em 0; background-image: linear-gradient(to right, rgb(200,200,200) 35%, rgb(0,100,200) 65%);">
Le fond en dégradé.
</div>
 
=== Le raccourci <code>background</code> ===