Ressources de Dreamweaver CS4

Utilisation des assistances visuelles avec des éléments de blocs de mise en forme non-CSS

Vous pouvez utiliser une feuille de style à la conception pour afficher les arrière-plans, les bordures ou le modèle de boîte d'éléments qui ne sont pas normalement considérés comme des blocs de mise en forme CSS. Pour ce faire, vous devez d'abord créer une feuille de style à la conception qui affecte l'attribut display:block à l'élément de page approprié.

Créez une feuille de style en cascade (CSS) externe. Pour ce faire, choisissez Fichier > Nouveau, puis sélectionnez Page de base dans la colonne Catégorie et CSS dans la colonne Page de base. Cliquez ensuite sur Créer.
Dans la nouvelle feuille de style, créez des règles qui affectent l'attribut display:block aux éléments de page à afficher en tant que blocs de mise en forme CSS.
Si, par exemple, vous souhaitez appliquer une couleur d'arrière-plan aux paragraphes ou aux éléments de liste, vous pouvez créer une feuille de style comprenant les règles suivantes :
```
p{ 
display:block; 
} 
li{ 
display:block; 
}
```
Enregistrez le fichier.
En mode Création, ouvrez la page à laquelle vous souhaitez associer les nouveaux styles.
Choisissez Format > Styles CSS > Conception.
Dans la boîte de dialogue Feuilles de style à la conception, cliquez sur le bouton plus (+) situé au-dessus de la zone de texte Afficher à la conception uniquement, sélectionnez la feuille de style que vous venez de créer et cliquez sur OK.
Cliquez sur OK pour fermer la boîte de dialogue Feuilles de style à la conception.
La feuille de style est associée à votre document. Si vous avez créé une feuille de style en suivant l'exemple précédent, tous les paragraphes et éléments de liste seront formatés au moyen de l'attribut display:block. Vous pouvez ainsi activer ou désactiver les assistances visuelles de bloc de mise en forme CSS pour les paragraphes et les éléments de liste.