Cascading Style Sheets have been around for a while now, and act as a complement to plain old HTML files. If you're new to HTML, then take a couple of minutes to learn a thing of two... you'll be surprised what you can do with style sheets!
Cascading Style Sheets: The How and the Why - An example of an external style sheet (Page 4 of 6 )
External style sheets are similar to internal style sheets, however, they are stripped of the <style> and </style> tags, and need to be referenced from another HTML file to be used.
Create a new file called “mystyle.css” and enter the following code into it:
h1
{
color: #a00808;
font-family: Verdana;
size: 18pt
}
Next, create a HTML file and name it external.html. Enter the following code into external.html:
<html>
<head>
<title> External Style Sheet Reference Example </title>
As mentioned above, you can see that the actual code in mystyle.css is exactly the same as it was in the inline example. In our HTML file, we simply place a <link> tag in the <head> section of our page. The rel=”stylesheet” attribute tells the browser that the link to the external file is a style sheet. The type=”text/css” attribute tells the browser that mystyle.css is a text file containing css (cascading style sheet) declarations. Lastly, the href=”mystyle.css” attribute tells the browser that the actual file we want to load is mystyle.css.