Quelle est la signification de la « cascade » dans CSS ?

Question

Quelle est la signification exacte du terme « cascade » en CSS ? J'ai des points de vue différents, donc je demande ici. Un exemple serait utile.

Answer 1

Dans ce contexte, le terme « mise en cascade » signifie que, puisque plus d'une déclaration de feuille de style peut s'appliquer à un morceau de code HTML particulier, il doit y avoir un moyen connu de déterminer quelle règle de feuille de style spécifique s'applique à quel morceau de code HTML.

La règle utilisée est choisie en cascadant des déclarations plus générales à la règle spécifique requise. La déclaration la plus précise est choisie.

Answer 2

Håkon Wium Lie (co-créateur de CSS) définit la « cascade » dans sa thèse de doctorat en sciences humaines comme « le processus de combinaison de plusieurs feuilles de style et de résolution des conflits entre elles » https://www.wiumlie.no/2006/phd/

Answer 3

Tu dois y penser de l'extérieur vers l'intérieur. Si vous avez une règle qui est sur la balise de corps, elle va « cascader » à travers chaque balise enfant. Si vous mettez une règle sur n'importe quelle étiquette à l'intérieur du corps, il adoptera cette règle, et ainsi de suite. Ainsi la règle cascade à travers tout le contenu à moins d'être interrompue par une règle à partir d'une balise intégrée.

Answer 4

Un éclaircissement qui pourrait aider. Si vous incluez deux feuilles de style et qu'il y a une règle avec la même spécificité dans chacune, celle incluse gagne en dernier. C'EST-À-DIRE que le dernier de la cascade a le plus d'influence.

(Il ne s'agit que d'une variation par rapport au fait d'avoir les deux règles dans la même feuille - la dernière gagne si toutes les autres choses sont égales.)

Par exemple, étant donné

body {
    background:blue;
}

body {
    background:green;
}

alors l'arrière-plan sera vert.