The cascade Flashcards
What is the CSS cascade?
The algorithm that resolves conflicts when multiple CSS rules apply.
What are the four stages of the CSS cascade?
- Position and order of appearance
- Specificity
- Origin
- Importance
How does position and order of appearance affect CSS rules?
The rule that appears later in the stylesheet wins conflicts.
What does the specificity stage determine?
It determines which CSS selector has the strongest match using a scoring system.
How does specificity affect CSS rules?
More specific selectors override less specific ones.
What is the origin in the CSS cascade?
It refers to where a CSS rule comes from (e.g., browser styles, user styles, or authored CSS).
How does origin influence which CSS rules are applied?
Rules from different origins follow a priority order, with authored CSS usually overriding browser defaults.
What is the importance stage in the CSS cascade?
It determines which rules are marked as important (!important overrides other rules).
What happens when two CSS rules have the same specificity?
The one that appears later in the stylesheet wins.
How can you check why a CSS rule is not being applied?
Use DevTools to inspect styles and find conflicts.
What tool can help visualize the origin and specificity of CSS rules?
Browser DevTools.
What does a CSS specificity algorithm do?
It calculates the strength of a selector to determine which rule is applied.
Why might a CSS rule not take effect even if it is written in the stylesheet?
It could be overridden by a more specific rule, an !important rule, or a later rule.
How do browser stylesheets affect the cascade?
Browsers apply default styles that can be overridden by authored styles with higher specificity.
What is the key takeaway of the CSS cascade?
The most relevant rule is determined by order, specificity, origin, and importance.
