Sujets CSS

Hiérarchie CSS

22/01/2022
CSS Hierarchy

La priorité CSS est la priorité hiérarchique de tous les CSS attribués aux balises HTML.

Quelles sont les priorités des règles CSS utilisées pour formater les balises HTML ? Quand et dans quelles situations le concept de !important est-il utilisé ?

Concepts affectant l’ordre de priorité CSS

  • CSS en ligne (CSS appliqué directement sur la balise)
  • CSS interne (CSS appliqué entre les balises <style></style> sur la même page.)
  • CSS externe (CSS appliqué en externe (à partir du chemin du fichier ou d’un autre site Web) avec la balise <link>.)
  • Class
  • Id
  • !important

Id > Class > HTML Balise

Quelles propriétés CSS attribuées aux balises Class, ID et HTML sont prioritaires ?

Si une balise HTML a ID, Classe comme type CSS interne et une règle CSS qui s’applique directement à la balise HTML, le navigateur appliquera l’ordre de priorité CSS ID > Classe > Balise HTML.

Inline > Interne > Externe Priorité CSS

Dans l’application des types CSS externes, internes et en ligne, l’ordre de priorité CSS sera en ligne > interne > externe côté navigateur.

Remarque : Le code CSS externe est visible dans l’onglet CSS.

Cependant, cette hiérarchisation ne s’applique que si chaque type d’implémentation CSS est utilisé de la même manière. Par exemple, dans l’utilisation de CSS externes et internes, les deux doivent être appliqués à l’id ou à la classe ou à la balise HTML, l’ordre de priorité changera également dans différents cas.