THREE WAYS OF HOW TO ADD CSS TO STYLE YOUR HTML WEBSITE

 

                        TYPES OF CSS

CSS (Cascading Style Sheets) can be classified into three main types:


1)Inline CSS:

Applied directly to individual HTML elements using the "style" attribute.

Has the highest specificity, meaning it takes precedence over other styles.

Example:

<p style="color: red; font-size: 16px;">This is a paragraph with inline CSS.</p>

2)Internal or Embedded CSS:

Defined within the HTML document, typically in the <style> tag within the <head> section.

Applies styles to specific elements or classes throughout the document.

Example:

<head>

  <style>

    p {

      color: blue;

      font-size: 18px;

    }

  </style>

</head>

<body>

  <p>This is a paragraph with internal CSS.</p>

</body>

3)External CSS:

Styles are stored in a separate CSS file and linked to the HTML document.

Allows for consistent styling across multiple HTML pages.

Example (external.css):

/* external.css */

p {

  color: green;

  font-size: 20px;

}

html

Copy code

<!-- index.html -->

<head>

  <link rel="stylesheet" type="text/css" href="external.css">

</head>

<body>

  <p>This is a paragraph with external CSS.</p>

</body>

These classifications help organize and manage styles in different ways,


Comments

Post a Comment