Comment créer des feuilles de style internes et externes dans Dreamweaver - des clichés

Lorsque vous créez de nouveaux styles dans Dreamweaver, vous devez décider si vous souhaitez enregistrer le style dans une feuille de style interne ou externe. Dans une feuille de style interne , la règle de style est enregistrée en haut du document HTML dans lequel vous souhaitez appliquer le style. Dans une feuille de style externe , les nouveaux styles sont enregistrés dans un document distinct qui peut être joint à n'importe quel fichier de votre site Web.

Les feuilles de style externes offrent les plus grands avantages, car l'utilisation d'un ensemble de styles sur plusieurs pages est plus efficace que la création de styles pour chaque page de votre site. Cela dit, les feuilles de style internes sont parfois un bon choix, par exemple lorsque vous créez un style qui ne s'applique qu'aux éléments d'une page.

Comment créer une feuille de style interne dans Dreamweaver

Les feuilles de style internes sont enregistrées dans le même fichier HTML que celui où elles sont appliquées. Ainsi, vous ne créez pas de fichier lorsque vous créez une feuille de style interne, comme vous le faites lorsque vous créez une feuille externe.

Au lieu de cela, lorsque vous créez une feuille de style interne, vous ajoutez simplement des balises dans les balises en haut du fichier HTML que vous avez ouvert dans Dreamweaver. Ensuite, lorsque vous créez des styles, vous enregistrez les nouvelles définitions de règles de style dans les balises de votre fichier.

La création d'un nouveau style interne dans Dreamweaver ne nécessite que deux étapes. Cliquez d'abord sur l'icône plus (+) dans le panneau Sources en haut du panneau CSS Designer. Sélectionnez ensuite Définir dans la page dans la liste déroulante. Vous avez terminé. Dreamweaver insère les balises dans le code de votre fichier et répertorie la feuille de style interne dans le panneau Sources avec la balise.

Comment créer une feuille de style externe dans Dreamweaver

Tout en haut du panneau CSS Designer, vous trouverez le panneau Sources. Ce panneau affiche le nom ou les noms de toutes les feuilles de style disponibles pour la page ouverte. Ce même panneau est utilisé pour créer ou lier des feuilles de style lorsque vous créez ou appliquez des styles.

Pour créer une feuille de style externe, créez et enregistrez un nouveau fichier HTML ou ouvrez un fichier existant dans Dreamweaver, puis suivez ces instructions:

1. Cliquez sur l'icône plus (+) dans le panneau Sources en haut de le panneau CSS Designer.

   Une liste déroulante s'ouvre avec trois options: Créer un nouveau fichier CSS, Joindre un fichier CSS existant et Définir dans Page.

   

2. Choisissez l'option Créer un nouveau fichier CSS dans la liste déroulante.

   La boîte de dialogue Créer un nouveau fichier CSS s'ouvre.

3. Entrez un nom pour votre nouveau fichier de feuille de style.

   Vous pouvez nommer les feuilles de style comme vous le souhaitez, tant que vous n'incluez pas d'espaces ou de caractères spéciaux autres que le trait d'union (-) ou le trait de soulignement (_).

   

4. Sélectionnez l'option Lien.

   Dans la plupart des cas, le lien est considéré comme la meilleure pratique et est sélectionné par défaut dans Dreamweaver.

   Dans la plupart des cas, l'option Importer est utilisée uniquement lorsque vous souhaitez appliquer plusieurs feuilles de style externes à la page, mais que vous souhaitez uniquement lier à une feuille de style. Dans ce cas, vous pouvez utiliser l'option Importer pour associer plusieurs feuilles de style à une seule.

5. Cliquez sur la flèche en regard de l'utilisation conditionnelle pour afficher les paramètres supplémentaires.

   Les paramètres d'utilisation conditionnelle sont utilisés pour configurer les requêtes de média pour les feuilles de style.

6. Cliquez sur OK.

   La feuille de style est enregistrée et liée à la page HTML que vous avez ouverte dans Dreamweaver. Remarque: Si vous travaillez sur une nouvelle page HTML, assurez-vous d'avoir enregistré la page; Sinon, vous ne pourrez pas créer et lier un nouveau fichier CSS.

Après avoir créé une feuille de style externe, vous pouvez lier la même feuille de style à autant de pages que vous le souhaitez en suivant les étapes de l'exercice qui suit immédiatement. Vous pouvez également ajouter autant de règles de style que vous le souhaitez à n'importe quelle feuille de style externe, ce qui est couvert dans divers exercices qui suivent sur la création de classes, de balises et d'autres types de styles.