Comment faire un dégradé sur le fond des pages ou modules des blog I-CliC ?
Pour un dégradé horizontal :
Dabord, créé une image dégradée, de 400 px de long par exemple, et 1 px de haut (travaillez d'abord sur plus de 1 px, puis réduisez l'image).
Importez la dans vos fichiers, par l'administration du blog et trouvez son adresse en cliquant sur la loupe (adresse commançant par http://idata.blogmaster.fr ).
Ensuite, allez dans Design / modifier la css, et copier le code suivant :
(Changez l'adresse de l'image dans le code !)
Pour faire un essai, ajoutez par exemple le code dans les colones de droite et de gauche :
Trouvez :
/* --------------- Structure -------------------- */
/* les styles ci dessous definissent l'aspect du blog quelque soit la structure (2-3 colonnes...)*/
Et collez le code dans rightnav et leftnav :
a++
Pour un dégradé horizontal :
Dabord, créé une image dégradée, de 400 px de long par exemple, et 1 px de haut (travaillez d'abord sur plus de 1 px, puis réduisez l'image).
Importez la dans vos fichiers, par l'administration du blog et trouvez son adresse en cliquant sur la loupe (adresse commançant par http://idata.blogmaster.fr ).
Ensuite, allez dans Design / modifier la css, et copier le code suivant :
background-image: url(http://idata.blogmaster.fr/0/02/64/13/degrades/degrade-1.jpg);
background-repeat: repeat-y;
background-repeat: repeat-y;
(Changez l'adresse de l'image dans le code !)
Pour faire un essai, ajoutez par exemple le code dans les colones de droite et de gauche :
Trouvez :
/* --------------- Structure -------------------- */
/* les styles ci dessous definissent l'aspect du blog quelque soit la structure (2-3 colonnes...)*/
Et collez le code dans rightnav et leftnav :
#rightnav {
background-image: url(http://idata.blogmaster.fr/0/02/64/13/degrades/degrade-1.jpg);
background-repeat: repeat-y;
}
/*colonne de droite*/
#leftnav {
background-image: url(http://idata.blogmaster.fr/0/02/64/13/degrades/degrade-1.jpg);
background-repeat: repeat-y;
}
/*colonne de gauche*/
background-image: url(http://idata.blogmaster.fr/0/02/64/13/degrades/degrade-1.jpg);
background-repeat: repeat-y;
}
/*colonne de droite*/
#leftnav {
background-image: url(http://idata.blogmaster.fr/0/02/64/13/degrades/degrade-1.jpg);
background-repeat: repeat-y;
}
/*colonne de gauche*/
a++
publié par Alex dans: Bouts de code