WEBVTT

00:00.000 --> 00:12.000
In this video, we will understand different types of CSS.

00:12.000 --> 00:15.080
Where are they used?

00:15.080 --> 00:16.680
Types of CSS.

00:16.680 --> 00:21.920
There are three types of CSS, inline, internal and external.

00:21.920 --> 00:28.440
Inline CSS refers to a way of applying CSS directly to a specific HTML element using the style

00:28.440 --> 00:31.600
attribute within the elements opening tag.

00:31.600 --> 00:37.600
This method allows you to define styles that only apply to that particular element.

00:37.600 --> 00:44.920
Internal CSS is a way to apply CSS styles directly within an HTML document, but instead of using

00:44.920 --> 00:51.400
the style attribute for individual elements, as in inline CSS, it uses the style tag within

00:51.400 --> 00:54.600
the head section of the HTML file.

00:54.600 --> 00:59.320
This allows you to style multiple elements on the page without creating an external

00:59.320 --> 01:01.760
style sheet.

01:01.760 --> 01:08.360
External CSS refers to a method of applying CSS styles to an HTML document by linking an external

01:08.360 --> 01:10.480
style sheet file.

01:10.480 --> 01:16.840
This style sheet is a separate dot CSS file that contains all the CSS rules for the website,

01:16.840 --> 01:24.560
allowing you to maintain a clean separation between content HTML and presentation CSS.

01:24.560 --> 01:27.320
Understand CSS with the code.

01:27.320 --> 01:33.760
We will understand the types with the help of our previously developed HTML code.

01:33.760 --> 01:36.240
Open the HTML file.

01:36.240 --> 01:41.800
We have already added inline CSS in the H1 tag to highlight the heading.

01:41.800 --> 01:48.400
This CSS type is used when we specifically want to highlight an HTML element.

01:48.400 --> 01:53.320
We have also used the internal CSS in this file, as the code in between the style tag is

01:53.320 --> 01:56.000
internal CSS.

01:56.000 --> 01:58.040
Create the CSS file.

01:58.040 --> 02:01.920
To add external CSS, we need to create a CSS file.

02:01.920 --> 02:08.240
Cut the code between the style tag and open the CSS file and paste it.

02:08.240 --> 02:13.480
These are the rules for the HTML file, which will be applied once we add external CSS in

02:13.480 --> 02:14.880
HTML.

02:14.880 --> 02:16.920
Add external CSS.

02:16.920 --> 02:20.160
We need to add the external CSS to the webpage.

02:20.160 --> 02:28.440
In the heading to the code, add link, RRL equals style sheet, hrf equals styles dot CSS.

02:28.440 --> 02:33.360
External CSS is used when you want to apply the same styles to multiple HTML pages by linking

02:33.360 --> 02:35.840
a single dot CSS file.

02:35.840 --> 02:41.200
It keeps the design CSS separate from the content.

02:41.200 --> 02:46.320
Experimenting with CSS helps you improve your skills and create unique designs.

02:46.320 --> 02:48.880
Keep exploring and trying new things.

02:48.880 --> 02:52.640
CSS offers endless creative possibilities and flexibility.