Ce n'est pas vraiment une FAQ, mais c'est un petit sujet pour lequel on me pose souvent la question, et je me dis que les débutants pourraient y trouver leurs comptes...

Quelles sont les règles de priorités entre CSS?

Pour rappel, différentes méthodes existent pour l'incorporation de fichiers CSS.

La balise <link>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
 
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
La règle @import
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
 
<style type="text/css">
  @import url(style.css);
</style>
Le CSS incorporé
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
 
<style type="text/css">
 *{
  margin:0;
  padding:0;
}
 
body{
 etc..
et les style en ligne, directement liés aux balises
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
 
<p style="font-weight:bold;">Style en ligne</p>
Mais quelles sont les règles de priorités entre ces différentes méthodes?

Entre la balise <link> et la règle @import, pas de différence notable au niveau de la priorité.

Tout ce qu'il faut retenir des priorités, c'est que le styles en ligne est plus prioritaire que les CSS incorporés, qui sont eux-mêmes plus prioritaires que les feuilles liées (ou importées).