Forum du site

Accueil

Couleurs et dégradé
Claire le 19 avril 2013 à 10:14	Rappel du sujet : Bonjour, Je souhaiterais me servir des couleurs renseignées grâce au formulaire pour créer un dégradé et utiliser celui-ci comme fond de page par exemple. Je voudrais utiliser une syntaxe telle que : `#page { backgroung-image : linear-gradient(couleur1, couleur2); }` Je rencontre des difficultés pour récupérer les couleur1 et couleur2. Pourriez-vous m’aider ? En vous remerciant.
Jean Christophe Villeneuve le 20 avril 2013 à 17:31	Couleurs et dégradé Hello L’exercice proposé est intéressant ! D’abord, un background suffit 😉 Ensuite, pour récupérer une couleur de la config d’Escal, c’est un peu plus compliqué car il faut passer par une feuille de style dynamique. Il va donc falloir : mettre à jour Escal en version 3.70.50 dès que cette version sera dispo (dans 6 h maxi) créer un fichier persoconfig.css.html (non non, il n’y a pas d’erreur) à la racine du dossier /squelettes dans ce fichier, mettre ce code `#CACHE{0} #HTTP_HEADER{Content-Type: text/css;} #page { background: linear-gradient( #CONFIG{escal/config/couleur1}, #CONFIG{escal/config/couleur2}); }`
Claire le 20 avril 2013 à 20:08	Couleurs et dégradé Bonsoir, Je vous remercie pour votre réponse. J’ai apporté les corrections et cela fonctionne très bien. C’est un résultat que je n’arrivais pas à obtenir jusqu’à présent. Je souhaiterai aller un peu plus loin. Pensez-vous qu’il soit possible d’ajouter un pourcentage ou un nombre de pixels aux couleurs pour personnaliser un peu plus le dégradé. J’ai essayé ceci : `#page { background: linear-gradient(to right, #CONFIG{escal/config/couleur1} 200px, #CONFIG{escal/config/couleur2} 950px); }` Mais ce code ne semble pas être reconnu.
Jean Christophe Villeneuve le 21 avril 2013 à 17:38	Couleurs et dégradé Ça devrait fonctionner avec `#page { background: linear-gradient(to right,[(#CONFIG{escal/config/couleur1}) ]200px,[(#CONFIG{escal/config/couleur2}) ]950px ) ; }` mais n’oublie pas que ça ne marchera qu’avec les navigateurs les plus récents. Il te faudra ajouter du code pour les versions plus anciennes.

Edito