Panneau Appliquer les styles

Le panneau Appliquer les styles vous permet d’appliquer, de modifier, de renommer et de supprimer des styles ; attacher ou détacher des feuilles de style en cascade (CSS) externes ; sélectionner toutes les instances d’un style, ou atteindre un fragment de code contenant un ensemble de règles de style. Le panneau Appliquer les styles affiche chaque style selon les règles du style, afin que vous puissiez rapidement identifier le style que vous voulez utiliser grâce à son apparence visuelle.

Lorsque vous ouvrez une page Web, le panneau Appliquer les styles répertorie les styles définis dans toutes les feuilles de style en cascade de la page, notamment les styles intralignes, externes et internes de la feuille de style en cascade. Les sélecteurs de classe et d’ID s’affichent soit sous le nom du fichier .css externe qui contient le style, soit sous Page active si le style se trouve dans une feuille de style en cascade interne. Les sélecteurs d’élément sont organisés de la même façon, mais s’affichent sous un autre titre appelé Sélecteurs contextuels en dessous de la liste des sélecteurs de classe et d’ID. Vous pouvez configurer le panneau pour qu’il répertorie tous les styles ou qu’il ne répertorie que les styles utilisés dans la page Web active ou dans la sélection actuelle dans la page. Quelles que soient les options que vous avez sélectionnées, les sélecteurs d’élément et intralignes apparaissent dans le panneau uniquement lorsque vous avez placé le curseur dans le contenu qui utilise le style ou sélectionné le contenu qui utilise le style.

Vous pouvez trier la liste de styles qui s’affichent dans le panneau Appliquer les styles et également limiter la liste pour qu’elle affiche uniquement les styles utilisés par la page Web active ou dans la sélection actuelle. Si la couleur d’arrière-plan blanche du panneau rend la visibilité d’un style particulier difficile, vous pouvez sélectionner une couleur à afficher dans le panneau derrière les styles qui ne contiennent pas de propriété d’arrière-plan.

Conseil :
Pour afficher provisoirement toutes les règles d’un style dans une fenêtre flottante, à côté de votre curseur, pointez sur le style dans le panneau Appliquer les styles.

Panneau Appliquer les styles

	Effacer les styles supprime tous les sélecteurs de classe et les styles intralignes de la sélection actuelle.
	Un fichier CSS externe lié à partir de la page Web active.
	Un fichier CSS externe importé dans la page Web active.
	Page active répertorie les sélecteurs de classe et d’ID des fichiers CSS internes et des fichiers CSS externes importés.
	Un style défini dans une feuille de style en cascade dans la page Web active.
	Une bordure rectangulaire continue s’affiche autour des styles utilisés par la sélection actuelle.
	Les sélecteurs de classe et d’ID contenus dans le fichier CSS externe lié (events.css).
	Un menu déroulant est associé à chaque style permettant de réaliser de nombreuses tâches liées aux styles. Pointez sur un style et cliquez sur la flèche, ou cliquez avec le bouton droit sur un style.

Les icônes qui s’affichent en regard de chaque style dans le panneau Appliquer les styles identifient le type de style et indiquent s’il est utilisé dans la page Web active.

Icônes du panneau Appliquer les styles

Icône	Description
	Un point rouge apparaît à côté des sélecteurs d’ID.
	Un point vert apparaît à côté des sélecteurs de classe.
	Un point bleu apparaît à côté des sélecteurs d’élément.
	Un point jaune s’affiche à côté des styles intralignes.
	Un cercle s’affiche autour d’un point de couleur pour indiquer les styles utilisés dans la page Web active.
	Un symbole @ apparaît en regard des feuilles de style en cascade externes importées.

Pour trier la liste des styles dans le panneau Appliquer les styles

Dans le panneau Appliquer les styles, cliquez sur Options, puis effectuez l’une des actions suivantes :

• Pour afficher les styles selon leur ordre d’apparition dans la CSS, sélectionnez Classer par ordre.

• Pour afficher les styles par ordre alphabétique et selon le type de style (sélecteurs de classe ou d’ID), sélectionnez Classer par type.

Pour afficher ou masquer les styles dans le panneau Appliquer les styles

Dans le panneau Appliquer les styles, cliquez sur Options, puis effectuez l’une des actions suivantes :

• Pour répertorier tous les styles contenus dans des feuilles de style en cascade internes, externes et intralignes de la page Web active, sélectionnez Afficher tous les styles.

• Pour répertorier uniquement les styles utilisés dans la page Web active, sélectionnez Afficher les styles utilisés dans la page active.

• Pour répertorier uniquement les styles utilisés par la sélection actuelle de la page, sélectionnez Afficher les styles utilisés dans la sélection.

  Remarque :
  Les sélecteurs d’élément et les styles intralignes apparaissent dans le panneau Appliquer les styles uniquement lorsque vous placez le curseur dans le contenu qui utilise le style ou lorsque vous sélectionnez ce contenu.

Pour afficher un arrière-plan coloré dans le panneau Appliquer les styles derrière les styles qui ne contiennent pas de règle de propriété d’arrière-plan

1. Dans le panneau Appliquer les styles, cliquez sur Options, puis sélectionnez Aperçu de la couleur d’arrière-plan.

2. Dans la boîte de dialogue Autres couleurs, sélectionnez une couleur, puis cliquez sur OK.

Voir aussi

Tâches

Appliquer un style

Concepts

Utilisation d'outils de feuille de style en cascade

Référence des feuilles de style en cascade

Utilisation de styles

Référence

Panneau Gérer les styles

Panneau Propriétés CSS