Attention, cette explication s'adresse à des gens qui ont des notions en html et/ou CSS.
Vous pouvez créer un effet de dégradé entièrement et uniquement en CSS3, voici comment:
Nous utilisons les couleurs #05698B et #FF0000 pour l'exemple, vous pouvez les remplacer par les couleurs de votre choix
Dans la source créer le style et placez entre la balise <head> et </head>.
Exemple:
<style type="text/css">
<!--
#degrade_bleu
{
background-image:gradient(#05698b, #FF0000); /* Norme W3C */
background-image:-moz-gradient(#05698b, #FF0000); /* Firefox */
background-image:-webkit-gradient(#05698b, #FF0000); /* Chrome, Safari */
background-image:-o-gradient(#05698b, #FF0000); /* Opera */
background-image:-ms-gradient(#05698b, #FF0000); /* IE */
}
-->
</style>
Et enfin définissez avec la propriété "id" le style que vous venez de créer à l'emplacement voulu :
Exemple:
<div id="degrade_bleu"> J'aime Wifeo </div>
Vous pouvez aussi appliquer un dégradé radial en modifiant un peu le code avec l'attribut "radial":
Exemple:
<style type="text/css">
<!--
#degrade_bleu
{
background-image:radial-gradient(#05698b, #FF0000); /* Norme W3C */
background-image:-moz-radial-gradient(#05698b, #FF0000); /* Firefox */
background-image:-webkit-gradient(radial, #05698b, #FF0000); /* Chrome, Safari */
background-image:-o-radial-gradient(#05698b, #FF0000); /* Opera */
background-image:-ms-radial-gradient(#05698b, #FF0000); /* IE */
}
-->
</style>
Exemple de dégradé radial :
Centre d'aide
FERMER LE MENU
