Home » Learn Code » CSS3 » How to add CSS in HTML? What are the three ways to insert CSS in HTML?

How to add CSS in HTML? What are the three ways to insert CSS in HTML?

html css

Today I am going to show you how to link your CSS style sheet to HTML page. So Let’s Start our today’s lesson and learn more about CSS links.

There are Three Ways to insert CSS in HTML

  • External CSS
  • Internal CSS
  • Inline CSS

External CSS

When you will add an external style sheet in your HTML document it will change the entire look of your website by adding only one line in your HTML head tag. So how? Then listen it’s very easy. Firstly add a link tag in your HTML head tag. Then add href attribute and give it a value which is your CSS file name with extension .css as shown below:

how to insert external style sheet

Then, press ctrl+S to save your HTML document. Congratulations, you have linked your external style sheet to your HTML file. So what are the benefits of external CSS:

It will allow you to work fast and easily. You will save your time by adding external css.

Internal CSS in HTML

So, the internal CSS that we will add is very easy. Simply add a style tag in HTML head tag and type your all CSS codes in it. As shown below:

how to insert internal style sheet

Inline CSS in HTML

At last, how to insert inline styles in your HTML source file or document. So this is very time-consuming work. But I will show you then as you wish, Now the inline styles will be added in your each HTML tags with the style attribute. as you can see below:

how to insert inline style sheet

As you can see in the above image styles are added in each tag.

So today you learned how to insert CSS in HTML and three ways of inserting styles in HTML. I hope you understood that very well. Search on Google and learn more. In our next lesson, we will learn what are the CSS selectors. What are there types?

9 thoughts on “How to add CSS in HTML? What are the three ways to insert CSS in HTML?”

Leave a Reply

Your email address will not be published. Required fields are marked *