Deux conseils pour appliquer des feuilles de style CSS dans DreamWeaver
Auteur：Eve Cole
Date de mise à jour：2009-05-31 21:17:47
1. Supprimez le soulignement du lien hypertexte et changez la couleur lorsque la souris survole le lien hypertexte :
Par défaut, les hyperliens dans les pages Web conçues avec DreamWeaver sont soulignés, ce qui n'est pas très joli. Pour supprimer ces soulignements gênants, la méthode introduite dans de nombreux journaux et magazines consiste à ajouter manuellement un morceau de code au code source HTML. En fait, il est facile de supprimer les soulignements des liens dans DreamWeave. Tout d'abord, créez un lien aléatoire dans la fenêtre de document de DreamWeaver. Vous pouvez voir que ce lien sera souligné. Comment supprimer ce soulignement ?
1. Cliquez sur "Texte" | "Styles CSS" | "Modifier la feuille de style..." dans la barre de menu (ou appuyez directement sur la touche de raccourci Ctrl+shift+E) pour afficher la fenêtre de dialogue Modifier la feuille de style.
2. Cliquez sur "Nouveau", puis dans la boîte de dialogue "Nouveau style", cliquez sur le bouton "Utiliser le sélecteur CSS".
3. Tapez a dans le champ Sélecteur, puis cliquez sur OK.
4. Ensuite, la boîte de dialogue "Définition du style CSS" apparaît. Dans la décoration de la classe Type, ne cochez aucune, puis cliquez sur OK, puis cliquez sur Terminé. Vous remarquerez immédiatement que le soulignement du lien a disparu dans Document Windows. Alors comment faire pour que le lien change de couleur lorsque la souris le survole ? Répétez les étapes un et deux ci-dessus. Cliquez ensuite sur la flèche déroulante à côté de Sélecteur, sélectionnez « a:hover » et cliquez sur OK. Dans la boîte de dialogue « Définition de style pour un : survol » qui apparaît, sélectionnez n'importe quelle couleur dans la couleur de la classe Type (par exemple, sélectionnez le rouge), puis cliquez sur OK, puis cliquez sur Terminé pour terminer. Appuyez sur F12 pour prévisualiser et placez la souris sur le lien. Le lien devient-il rouge ? Si dans la boîte de dialogue "Définition de style pour un survol" à l'instant, dans la classe Backgroud, vous sélectionnez la couleur de fond pour qu'elle soit verte, alors lorsque vous placez la souris sur le lien hypertexte, non seulement le lien deviendra rouge, et là sera également un fond vert. En fait, grâce à la boîte de dialogue de définition du style CSS, vous pouvez également obtenir davantage d'effets spéciaux. Les amis intéressés voudront peut-être y réfléchir.
2. Créez une feuille de style CSS externe réutilisable. Après avoir utilisé DreamWeaver pour créer un style CSS dans une certaine page Web, si vous souhaitez appliquer le style à une autre page Web, vous n'avez pas besoin de recréer le style CSS. Lorsque vous créez un fichier de feuille de style CSS externe (feuille de style CSS externe), vous pouvez appeler les styles de ce fichier de feuille de style à volonté à l'avenir. Afin de faciliter la gestion, créez d'abord un nouveau dossier dans le dossier où se trouve le site, nommé CSS, qui sert spécialement à placer les fichiers de feuilles de style externes (son extension est css).
1. Appuyez sur Ctrl+shift+E dans la fenêtre du document pour afficher la fenêtre de dialogue Modifier la feuille de style. 2. Cliquez sur "lien".
3. Dans la boîte de dialogue contextuelle Lien vers une feuille de style externe, cliquez sur PARCOURIR et recherchez le dossier CSS que vous venez de créer.
4. Dans la colonne "Nom du fichier" de la fenêtre Sélectionner un fichier de feuille de style, tapez *.css (* peut être n'importe quel nom). Veuillez noter qu'il n'y a actuellement aucun fichier de feuille de style dans le dossier CSS. tapez dans le champ "Nom du fichier" qui deviendra le nom du nouveau fichier de feuille de style externe. Par exemple, tapez title.css, puis cliquez sur Sélectionner | OK.
5. Dans la fenêtre de dialogue Modifier la feuille de style, title.css (lien) sera ajouté, double-cliquez dessus.
6. Dans la fenêtre pop-up « title.css », cliquez sur « Nouveau ».
7. Dans la boîte de dialogue "Nouveau style", cliquez sur le bouton "Créer un style personnalisé (classe)". 8. Tapez un nom dans la colonne Nom, tel que mon titre, puis cliquez sur OK.
9. Dans la boîte de dialogue suivante « Définition de style pour .myheadline dans title.css », effectuez divers paramètres tels que la police et la couleur, puis cliquez sur OK lorsque vous avez terminé. Si vous souhaitez créer un nouveau style, cliquez à nouveau sur "Nouveau", répétez les étapes 6, 7, 8 et 9, et enfin cliquez sur "enregistrer" | "terminé", et le fichier de feuille de style externe title.css sera créé. Tous les styles de title.css seront répertoriés dans le sous-menu "TEXTE" | "Styles CSS" de la barre de menu. Si vous souhaitez appeler ce title.css dans d'autres pages Web, répétez simplement les étapes 1 à 3 ci-dessus, puis entrez title.css dans la colonne "Nom du fichier" de la fenêtre Sélectionner un fichier de feuille de style. Cliquez sur "sélectionner" | "ok" | "terminé", tous les styles de title.css apparaîtront dans le sous-menu "Texte" | "Styles CSS" sur la barre de menu de la page Web, et vous pourrez les appliquer à cette page Web ces styles.
