1
00:00:00,000 --> 00:00:04,540
[MUSIC]

2
00:00:04,540 --> 00:00:05,820
Well done.

3
00:00:05,820 --> 00:00:09,810
You've learned quite a bit about
working with style sheets.

4
00:00:09,810 --> 00:00:14,230
You've learned the benefits of keeping
your styles in an external file.

5
00:00:14,230 --> 00:00:18,620
You've learned some important 
resources for keeping your skills sharp.

6
00:00:18,620 --> 00:00:22,990
You've worked with a variety of 
selectors, properties, and values.

7
00:00:24,480 --> 00:00:27,980
And yet, it feels like something's 
missing, doesn't it?

8
00:00:27,980 --> 00:00:32,700
CSS stands for Cascading 
Style Sheets, after all.

9
00:00:32,700 --> 00:00:37,626
By making it this far through the course,
you've gotten some solid practice

10
00:00:37,626 --> 00:00:42,340
working with style sheets. But what 
makes them Cascading Style Sheets?

11
00:00:43,580 --> 00:00:48,239
An important part of learning
CSS is understanding how CSS

12
00:00:48,239 --> 00:00:53,170
rules are applied by
the browser via the cascade.

13
00:00:53,170 --> 00:00:54,814
In CSS, the cascade

14
00:00:54,814 --> 00:01:00,700
is what determines which styles 
are assigned to an HTML element.

15
00:01:00,700 --> 00:01:06,400
Without a cascade, CSS might as well
stand for conflicting style sheets.

16
00:01:07,690 --> 00:01:12,427
For example, if we write a rule that
tells our h1 elements to be red,

17
00:01:12,427 --> 00:01:17,185
then somewhere else we write another
rule that tells them to be blue,

18
00:01:17,185 --> 00:01:21,850
we have two style declarations
contradicting each other.

19
00:01:21,850 --> 00:01:25,433
So which one will win?
That's where the cascade 

20
00:01:25,433 --> 00:01:29,550
helps resolve the conflict 
between two or more declarations.

21
00:01:31,000 --> 00:01:35,776
The first measure the CSS cascade
uses to settle conflicts in

22
00:01:35,776 --> 00:01:38,780
CSS is called origin and importance.

23
00:01:40,390 --> 00:01:45,580
When I say origin, I mean that 
CSS styles can come from three 

24
00:01:45,580 --> 00:01:49,560
different sources. The first is the 
user agent style sheet.

25
00:01:49,560 --> 00:01:54,097
Which, if you remember way back
to the beginning of this course,

26
00:01:54,097 --> 00:01:57,160
means the CSS a browser
applies by default.

27
00:01:58,920 --> 00:02:04,790
Another source is the user style sheet,
which contains style set by a user.

28
00:02:04,790 --> 00:02:07,996
Users can have special 
styles predefined

29
00:02:07,996 --> 00:02:12,850
that override some of
the browser's default styles.

30
00:02:12,850 --> 00:02:18,356
These are often used for accessibility
to assist users with disabilities,

31
00:02:18,356 --> 00:02:25,150
who may need larger font sizes, specific
colors or higher contrast on the page.

32
00:02:25,150 --> 00:02:28,207
The third source is
the author style sheet,

33
00:02:28,207 --> 00:02:32,020
which contains the CSS we
write to style the HTML page.

34
00:02:33,170 --> 00:02:38,060
So all the CSS we've written up 
to this point was written in 

35
00:02:38,060 --> 00:02:42,573
author style sheets. By default, 
the CSS and author style sheets

36
00:02:42,573 --> 00:02:46,920
has more importance than user 
agent and user style sheets.

37
00:02:48,990 --> 00:02:53,440
But determining origin doesn't
settle all conflicts by itself.

38
00:02:54,570 --> 00:03:00,160
After all, you could have two conflicting
styles in your author style sheet.

39
00:03:00,160 --> 00:03:05,890
From there, the CSS cascade
looks at selector specificity.

40
00:03:05,890 --> 00:03:07,300
We'll take a look at that next.