La création/la gestion de vos styles

• Dreamweaver ( Feuilles de style)
• Création de site

01/01-2004 à 00:00 : Pour créer un nouveau style, une fois dans la palette ou la boîte de dialogue feuille de style, cliquez sur Nouveau. Vous arrivez sur cette fenêtre :

---

Pour créer un nouveau style, une fois dans la palette ou la boîte de dialogue feuille de style, cliquez sur Nouveau. Vous arrivez sur cette fenêtre :







Nous allons créer un balise personnalisée


Donnez un nom à cette balise (en commençant le nom par un point). Évitez les espaces. Nous l'appellerons Style1. Validez à l'aide de OK. La fenêtre qui apparaît ensuite n'est pas très difficile à appréhender. Sur la gauche, sur quel point la personnalisation va jouer (police, fond, alignement du texte, les listes...), sur la droite, les différents paramétrages de chaque point.



€ Type : police de caractère, la couleur, si le texte va être souligné, en italique, gras ...

€ Arrière Plan : Y aura-t-il une image d'arrière plan, une couleur.

€ Bloc : les paragraphes. L'alignement le retrait...

€ Boîte : épaisseur de la bordure d'une image. Certains de ces effets s'appliquent également aux calques (utilisation des calques déconseillé pour une compatibilité maximum entre les 2 navigateurs)

€ Bordure : épaisseur et couleurs des bordures. Sert pour les tableaux.

€ Liste : Permet d'appliquer un style de puce différent. Par exemple une puce peut être cerclée (comme sur cette liste ou bien carrée ou simplement un point noir). Vous pouvez également préciser que ces puces seront des images. Dans ce cas là, choisissez simplement l'emplacement de votre image qui remplacera vos puces.

€ Positionnement : ne concerne que les calques

€ Extensions : vous permet par exemple de changer le curseur en main, croix, point d'interrogation ...    

Vous avez créé votre premier style ? allons maintenant l'appliquer

vous avez plusieurs possibilités pour appliquer un style. Soit c'est une balise (Un paragraphe entier (), un texte aligné (), un lien () ...) Dans ce cas là, il vous suffit de connaître le nom de la balise. Soit c'est ce n'en est pas une. Par exemple un mot à l'intérieur d'un paragraphe.

Vous voulez appliquer le style à un paragraphe. Cliquez à l'intérieur du paragraphe. Puis regardez en bas de l'écran, les balises dans la barre d'état ont changées. Vous devriez normalement voir un . Cliquez dessus puis Clic droit, sélectionnez Définir Classe, vos styles sont listés ici. Choisissez celui que vous voulez appliquer comme sur image ci-contre.
Une fois sélectionné, le paragraphe prend les caractéristiques du style.

Dans le cas d'un simple mot ou de parties de texte ne pouvant être par des balises, sélectionnez le texte puis affichez la palette des Styles (Touche F7), sélectionnez alors votre style.







Comment créer un feuille de style externe ?
Dans ce cas, toutes les polices, couleurs ... spécifiées se trouvent dans un seul fichier. Toutes les pages rattachées à cette feuille dépendent (en ce qui concerne la présentation) de cette unique feuille de style. Donc extrêmement pratique pour modifier l'intégralité de ses pages.


Rendez vous dans la boîte de dialogue Feuille de style accessible à l'aide du Clic droit sur votre page, sélectionnez Styles CSS puis modifier la feuille. Vous arrivez sur cette fenêtre :







Cliquez alors sur . Dreamweaver vous demande alors de choisir un fichier qui contient vos styles. Problème. Vous n'en avez pas. En fait, c'est comme ça que vous allez la créer. En saisissant le nom de votre future feuille de style, la feuille de style va être créée. (Pas très intuitif j'en conviens). Donc nommez votre future feuille de style (en n'oubliant pas l'extension .css) puis validez. Une nouvelle entrée s'est ajoutée comme sur l'image ci-contre.


Double cliquez sur le nom de votre feuille de style. Vous pouvez alors ajouter vos styles personnalisés, reparamétrer les balises standards ... Bref confectionner votre présentation.

---

---

Dossiers

---