Le panneau CSS Designer vous permet d’appliquer des dégradés à l’arrière-plan de vos sites web. La propriété de dégradé est disponible dans la catégorie d’arrière-plan.
Cliquez sur 
à côté de la propriété de dégradé afin d’ouvrir le panneau dégradés. Ce panneau vous permet :
- De choisir les couleurs dans différents modèles colorimétriques (RVBa, hexadécimale ou HSLA). Ensuite, d’enregistrer différentes combinaisons de couleurs sous la forme de nuances de couleur.
- Pour rétablir la couleur d’origine d’une nouvelle couleur, cliquez sur la couleur d’origine (K).
- Pour modifier l’ordre des nuances, faites glisser chaque nuance vers la position souhaitée.
- Pour supprimer une nuance de couleur, faites glisser la nuance hors du panneau.
- D’utiliser des taquets de couleurs pour créer des dégradés complexes. Cliquez n’importe où entre les taquets de couleur par défaut pour créer un taquet de couleur. Pour supprimer un taquet de couleur, faites-le glisser hors du panneau.
- De spécifier l’angle d’un dégradé linéaire.
- Pour répéter le motif, modifiez la propriété background-repeat.
- D’enregistrer des dégradés personnalisés sous forme de nuances.
background-image: linear-gradient(57deg,rgba(255,255,255,1.00) 0%,rgba(21,8,8,1.00) 46.63%,rgba(255,0,0,1.00) 100%)
- 57deg : indique l’angle du dégradé linéaire
- rgba(255, 255, 255, 1.00) : couleur du premier taquet de couleur
- 0% : indique le taquet de couleur
Remarque :
Dreamweaver ne prend en charge que les valeurs « % » pour les taquets de couleur. Si vous utilisez d’autres valeurs, comme px ou em, Dreamweaver les lit comme « zéro ». En outre, Dreamweaver ne prend pas en charge les couleurs CSS. Si vous spécifiez ces couleurs dans le code, elles sont lues comme « zéro ».
Si vous utilisez les dégradés comme arrière-plan, vous pouvez configurer Dreamweaver de façon à rendre correctement les dégradés dans différents navigateurs web. Dreamweaver ajoute les préfixes fournisseur appropriés au code, de façon à permettre aux navigateurs web d’afficher les dégradés de façon adéquate.
Dreamweaver peut écrire les préfixes fournisseur suivants avec le format w3c :
- Webkit
- Firefox
- Opera
Par défaut, Dreamweaver écrit les préfixes fournisseur pour Webkit et le mode En direct de Dreamweaver. Vous pouvez choisir les autres fournisseurs désirés dans la boîte de dialogue Préférences (Préférences > Styles CSS).
Remarque :
pour les ombres de zone, les préfixes Webkit et w3c sont toujours générés, que vous les ayez ou non sélectionnés dans la section Préférences.
Les modifications apportées aux dégradés sont également répercutées dans les syntaxes spécifiques aux fournisseurs. Si vous ouvrez un fichier existant qui contient des syntaxes spécifiques à un fournisseur sous Dreamweaver CC, veillez à choisir le préfixe fournisseur requis dans les Préférences. En effet, par défaut, Dreamweaver ne met à jour le code lié à Webkit et à le mode En direct de Dreamweaver que lorsque vous utilisez ou modifiez des dégradés. Par conséquent, les autres syntaxes spécifiques à un fournisseur dans votre code ne sont pas mises à jour.
Vous pouvez modifier en un seul clic l’ordre (d’apparition dans le code) des images et des dégradés d’arrière-plan.
Cliquez sur la flèche en regard de la propriété url ou gradient dans CSS Designer.
Remarque :
Dreamweaver CC contient une mise en œuvre de base de la fonction de permutation d’arrière-plan. Lorsque vous utilisez plusieurs valeurs ou images, il se peut que la permutation ne fonctionne pas comme prévu. En outre, supposons que vous ayez appliqué une image, une deuxième image, puis un dégradé à l’arrière-plan. La permutation du dégradé produit l’ordre suivant : dégradé, deuxième image, première image.
Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.