Comment : utiliser la fenêtre Propriétés CSS
La fenêtre Propriétés CSS vous permet d'afficher et modifier les propriétés du style de la feuille de style en cascade (CSS) d'un élément. Pour les pages Web Forms, vous pouvez utiliser la fenêtre Propriétés CSS en mode Design. Vous pouvez l'utiliser en mode Source pour tout type de page. Vous pouvez également l'utiliser avec un fichier CSS externe ou avec la fenêtre Gérer les styles.
Pour ouvrir la fenêtre Propriétés CSS
- Dans le menu Affichage, sélectionnez Propriétés.
La fenêtre Propriétés CSS affiche tous les styles utilisés par l'élément sélectionné actuellement dans une page Web. Vous pouvez également consulter l'ordre de priorité de ces styles, et toutes les propriétés et valeurs de ces styles.
Vue d'ensemble de la fenêtre Propriétés CSS
La fenêtre Propriétés CSS contient les éléments suivants.
Élément d'interface |
Description |
|---|---|
Boutons d'affichage |
La partie supérieure de la fenêtre affiche les boutons Afficher la liste classée, Afficher la liste alphabétique et des boutons Afficher les propriétés définies en haut. Ces boutons vous permettent de modifier l'ordre dans lequel les propriétés s'affichent. Pour afficher uniquement les propriétés auxquelles des valeurs ont été assignées en haut de chaque catégorie, sélectionnez Afficher les propriétés définies en haut. Les propriétés sans valeur s'affichent en bas de chaque catégorie. |
Résumé |
Vous pouvez cliquer sur le bouton Résumé pour répertorier les propriétés de tous les styles qui affectent l'élément sélectionné. Cette liste inclut des propriétés qui peuvent ne pas apparaître dans la section Règles appliquées. |
Règles appliquées |
Indique les règles de style appliquées à un élément. Si vous sélectionnez une règle dans cette liste, ses propriétés sont mises en surbrillance dans la section Propriétés CSS ci-dessous. Si aucun style n'est encore appliqué, la section Règles appliquées indique qu'aucune règle n'est appliquée. Les règles au bas de la liste ont une priorité supérieure à celles situées plus haut. Cliquez avec le bouton droit sur un sélecteur pour afficher un menu contextuel qui contient des options supplémentaires pour utiliser des styles de ce sélecteur. |
Propriétés CSS |
Utilisez cette section pour afficher ou définir des propriétés CSS pour le style sélectionné sous Règles appliquées. Une ligne rouge à travers les propriétés indique que ces propriétés ne sont pas héritées par la sélection actuelle ou qu'un autre style leur est substitué. |
Conseil
Si vous double-cliquez sur une règle appliquée ou une propriété CSS qui a un attribut de valeur, Visual Studio ouvre la feuille de style.L'emplacement de la définition de règle est affiché.Sinon, vous pouvez cliquer avec le bouton droit sur une règle ou une propriété et choisir Atteindre le code.
Modification d'un style dans la fenêtre Propriétés CSS
Vous pouvez utiliser la fenêtre Propriétés CSS pour modifier la mise en forme ou le style d'un seul élément ou de tous les éléments qui partagent une classe CSS.
Pour modifier les propriétés d'un style
Dans la liste Règles appliquées de la fenêtre Propriétés CSS, sélectionnez un élément, un style intraligne, un ID d'élément ou une classe CSS d'élément.
Dans la section Propriétés CSS, modifiez les propriétés.
Identification des styles appliqués à un élément
La fenêtre Propriétés CSS vous permet de consulter tous les styles appliqués à un élément. Vous pouvez également voir quelles propriétés de style sont substituées. Les propriétés de style substituées barrées en rouge, indiquant ainsi que la propriété n'est pas appliquée à l'élément sélectionné actuellement.
Par exemple, un élément peut avoir à la fois une règle de style intraligne et une règle de style d'une feuille de style appliquées. Dans ce cas, la règle de style intraligne se substitue à la règle de feuille de style.
Pour consulter un résumé de toutes les propriétés appliquées à une sélection
Sélectionnez un élément dans la page, puis cliquez sur Résumé pour basculer en mode sommaire.
Dans la section Propriétés CSS, toutes les propriétés appliquées à l'élément sélectionné sont affichées.
Cliquez sur une propriété sous Propriétés CSS pour esquisser la règle de style associée sous Règles appliquées.
Cliquez une nouvelle fois sur le bouton Résumé pour basculer hors du mode résumé.
Notes
Si vous maintenez le pointeur de la souris sur une propriété barrée, une info-bulle de propriété substituée identifie la propriété qui la remplace.