External Style Sheets
|
| ||||
| ||||
|
|
You have seen how you can use a style sheet in the document head to affect the presentation of your entire document. However, if you have a large number of documents, it would be nice to be able to use a single style sheet for all of them. This is indeed possible, and the easiest way to use CSS with HTML.
All you have to do is put the style sheet into a separate
file and use the LINK element to link to it,
like this:
<LINK REL="Stylesheet" TITLE="Default Stylesheet" MEDIA="Screen" HREF="style/default.css" >
Remember that the value of the HREF
attribute is the URL of the stylesheet itself. Now you can
dispense with the STYLE element altogether, put
your style rules in a separate file and just link to it from
all of your documents. Here you see another advantage to
using CSS over arbitrary elements to affect presentation. If
you have a whole big bundle of documents linked to a single
style sheet in this way, you can change their style by
simply changing the style sheet, with no need to re-edit
every HTML document individually.
This tutorial should have taught you the basics of CSS. You now know how to insert declarations into your document, how to build rule sets and put them in style sheets that can be embedded into the document or linked to it externally.
However, you probably have a whole lot of questions.
Things like, what if an element matches more than one
selectors and they have conflicting declarations? What if it
also has a STYLE attribute? What takes
precedence? Well, that's the Cascading part of
Cascading Style Sheets, and it's a mondo chapter that we'll
get into later on.
Not to mention the obvious question, what in the name of <insert preferred deity> do all the properties and values do and how do I use them?!?. Patience, dear reader, for all will be revealed in future HTML with Style tutorials, coming to a URL near you soon.
