External CSS

External CSS has pretty much become the standard way to style HTML pages these days.

It allows for a clean, separate CSS Stylesheet which houses all of your style information, and that file is loaded in when the HTML document is loaded in the browser.

Main Benefit: Changes made a single time in your CSS Stylesheet will apply to your entire website. There is no need to manually change styles page by page.

To start, first you create a CSS Stylesheet, with a .css extension and upload it on the same server as your website.

Next, to connect an external stylesheet to your HTML document, you use the HTML link tag in the head of your HTML document like this:

Code:


<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet" href="/file/stylesheet.css">

</head>

<body>

Content of the page goes here.

</body>

</html>