How To Insert CSS into an HTML document?


There are three ways to insert CSS into an HTML document. They are:

  1. External CSS
  2. Internal CSS
  3. Inline CSS


External CSS

In external CSS you have to create a separate css file, for example, style.css and then link this file to html document using <link> tag inside <head> section of an HTML document. The code is

<link rel="stylesheet" href="style.css">

syntax:
/*
<link rel="stylesheet" href="filename.css">
*/



Internal CSS

In internal CSS, CSS code is written inside the <style> tage inside <head> section of an HTML document. For example:

<head>
   <style>
         body{
       background-color: red;
      font-family: arial;
   </style>
</head>

Syntax
/*
<head>
    <style>
   -------------------------
   -------CSS Code-------
  --------------------------
    </style>
</head>
*/



Inline CSS

In Inline CSS, CSS code is written in the 'style' attribute of any single element. It is used to provide a unique style to an element or tag.
For example:

<p style="color:red;">This is paragraph</p>

Syntax:
/*
<tagname style="----css code----"> Content</tagname>
*/



Note:

Inline style has the highest priority over External and Internal CSS.



Trending Posts

Is Web Development a Good Career?

How Long Does It Take to Learn Programming?

Easy Light Bulb Project: HTML, CSS, and JavaScript

How to Become a Web Designer: A Complete Guide

60hz vs 90hz vs 120hz | Which One is Best? | What is Refresh Rate?

How To Create a Fake Facebook Login Clone Using Only HTML and CSS?

Brief History Of Computer

How To Create A Magic 8 Ball Using HTML, CSS, and JavaScript?

Is HTML a Programming Language?

Shield Your Small Business: Must-Have Cybersecurity Strategies