What are the different methods to add styles to HTML?

Frequently Asked Questions CSS FAQ
1

Question

What are the different methods to add styles to HTML?

Answer

There are a few different ways to add styles to our HTML.

We can link an external stylesheet in the <head> of our HTML with the <link> element, then add CSS rules to our external stylesheet:

<head>
  <title>My Site</title>
  <link rel="stylesheet" type="text/css" href="style.css"/>
</head>

We can use an internal stylesheet in the <head> of our HTML using the <style> element, with CSS rules between the <style> tags:

<head>
  <title>My Site</title>
  <style>
    h1 {
      color: blue;
    }
  </style>
</head>

Finally, we can add inline styles on specific elements of our HTML using the style attribute with CSS declaration(s) for the value:
<h1 style="color: blue; font-size: 48px;">Hello world!</h1>

3 Likes