N5 – CSS locations

There are three places that CSS data can be stored for use with HTML files.

Inline

Inline CSS applies to one html element it is added as the value for a style attribute.

<h1 style='color:red;'>Page heading</h1>

Internal

Internal CSS is declared inside <style> which is located in the <head> area of the page. It applies to one page of html.

<head>
<head>
 <style>
   p {background-color:pink;}
 </style>
</head>

 

External

External CSS is stored inside a separate text file (.CSS) it applies to all webpages that link to it (applies to whole site). A link is required in the <head> of the HTML file this link includes the name of the CSS file

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

The CSS file has the selectors and properties stored in the same way as internal

#redBox { background-color:red;
              Color:black;}

Leave a Reply

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