Suggest an editImprove this articleRefine the answer for “What does "cascade" mean in the behavior of CSS rules?”. Your changes go to moderation before they’re published.Approval requiredContentWhat you’re changing🇺🇸EN🇺🇦UAPreviewTitle (EN)Short answer (EN)**The cascade in CSS** is the mechanism by which the browser decides which of several conflicting rules to apply to an element, taking into account the rule's source, selector specificity, and order in the code. **Key point:** priority is resolved in sequence: source first, then specificity, and only then the order in which rules are written.Shown above the full answer for quick recall.Answer (EN)ImageThe cascade in CSS is the mechanism by which the browser decides **which of several conflicting rules to apply to an element**. If different styles match the same element, CSS "cascades" them by priority and picks the final value, like water flowing down a cascade. The cascade takes three main criteria into account: --- ### **1. Rule source** Higher-priority sources override lower-priority ones. The conditional hierarchy: 1. inline styles (`style=""`) 2. styles in `<style>` or a linked CSS file 3. default browser styles --- ### **2. Specificity (selector precision)** If two rules from the same source conflict, the one with higher "precision" wins. By significance: 1. `id`, the most precise 2. classes, pseudo-classes 3. tags, pseudo-elements For example: ```css p { color: blue; } /* low specificity */ .text { color: green; } /* higher */ #main { color: red; } /* highest */ ``` The result will be `red`. --- ### **3. Order in the code** If the specificity is the same, the rule that is **written later** wins. ```css p { color: blue; } p { color: black; } /* this one applies */ ``` --- **Summary:** the cascade is a system of priorities that decides which CSS rule to apply when there is more than one. It takes into account *source → specificity → rule order*.For the reviewerNote to the moderator (optional)Visible only to the moderator. Helps review go faster.