WEBVTT FILE





1
00:00:06.680 --> 00:00:12.420
in this video we're going to learn external CSS so we have covered in line

2
00:00:12.420 --> 00:00:18.779
and internal CSS and this time we will see how to link the HTML document to an

3
00:00:18.779 --> 00:00:24.119
external file where it can extract all the decoration and styling so I'm just

4
00:00:24.119 --> 00:00:28.740
going to paste the contents of the previous file ok so the way it works is

5
00:00:28.740 --> 00:00:33.690
rather than having a style element where we put all the decoration we're gonna

6
00:00:33.690 --> 00:00:42.149
store this code inside an external file ok so let's create a folder called CSS

7
00:00:42.149 --> 00:00:51.989
ok and inside this folder create a new file called style dot CSS so it's a CSS

8
00:00:51.989 --> 00:01:01.160
file and the extension is dot CSS now we're gonna copy paste this code ok

9
00:01:01.460 --> 00:01:12.960
alright so and then we're gonna put it in this style file ok now we need to

10
00:01:12.960 --> 00:01:19.470
link this file to that file so that we can actually import the styling the way

11
00:01:19.470 --> 00:01:27.450
to do that is by adding a link elements inside the head elements okay it's a

12
00:01:27.450 --> 00:01:37.729
self closing tag and we're gonna have a relationship of style sheets

13
00:01:39.500 --> 00:01:49.560
okay I'm gonna need to give it a type which is text/css okay and now we need

14
00:01:49.560 --> 00:01:57.810
to give it an H an inch rev telling the location of the styling file okay and

15
00:01:57.810 --> 00:02:03.810
now we can see the styling appearing there so it's pretty easy first of all

16
00:02:03.810 --> 00:02:09.810
we need an external file and then we need to link the HTML file to this CSS

17
00:02:09.810 --> 00:02:12.080
file