|
Using linked style sheets
Having separated style from substance by moving the style information out of the body and into the head of your document, you can now take this idea one step further and define a style sheet for your entire site instead of each document individually.
To do this, store all of your style definitions in an ASCII file with a .css file extension, and then link documents to this style sheet with the LINK REL tag.
<LINK REL="stylesheet" HREF="site_styles.css">
(Again, using Dreamweaver you don't have to type that into your file; the CSS Style palette keeps track of linked style sheets for you.)
If you have many styles defined in site_styles.css and want to use all but one of them in a particular document, you can override that one style in the document itself. This is where the cascading part of Cascading Style Sheets comes in.
For example, if site_styles.css contains the Helvetica/green definition for H1 s, and for the current document you want all H1 s to be Helvetica and red, you could put the following code in the head of your document:
<LINK REL="stylesheet" HREF="site_styles.css">
<style type="text/css">
H1{color: red }
</style>
All the H1 s in your document will use the font information from the linked stylesheet, but they will be red instead of green because the local style definition of the H1 tag overrides the corresponding parts (the color, in this case) of the style definition in the linked style sheet.
|