[MUSIC]

Now that we've explored many of the core features of CSS, it's time to take this

knowledge further by reviewing a few more important fundamental CSS concepts.

As we know, CSS stands for Cascading Style Sheets.

And we know that style sheets are the documents we use to write CSS.

But what does cascading actually mean?

An important part of learning CSS is understanding how CSS rules are applied by

the browser via what's called the cascade.

In CSS, the Cascade is what determines which styles are assigned to an element.

Without the Cascade, CSS might as well stand for Conflicting Style Sheets.

For example, if we write a rule that tells our h1 elements to be red,

[SOUND] then somewhere else we write another rule that tells them to be blue,

well, we have to two style declarations contradicting each other.

So, which one will win?

Well, that's where the Cascade helps resolve the conflict between two or

more declarations.

CSS styles can cascade down to elements from many origins.

And [SOUND] there are three main steps or sources of style information that

Cascade follows to determine which properties get assigned to an element.

Those steps are [SOUND] importance, [SOUND] specificity, [SOUND] and

source order.

So let's go over these.

[SOUND] First, importance depends on the origin of the style sheet,

which can come from different sources.

One of those sources is the [SOUND] User Agent style sheet,

which is the CSS a browser applies by default.

As we've learned in previous lessons,

each browser has its own User Agent style sheet.

Another [SOUND] source is the User [SOUND] style sheet,

which contains styles set by a user.

Users can have special styles predefined that override some of

the browser's default styles, and these are oftentimes used for accessibility for

users with special needs who may need larger font sizes, specific colors or

contrast on the page.

[SOUND] The third source is the Author style sheet,

which contains the CSS we write to style the HTML page.

So, all the CSS we've written up to this point were written in

an Author style sheet.

And by default, the CSS in an Author style sheet has

more importance than User Agent and User style sheets.

Once the Cascade decides the importance of a CSS property based on a source origin,

the next step assigns its specificity, and we'll cover that next.