A 'Short' Tutorial on CSS- Spiders love CSS . . .
How we used CSS for Spider-Food
My task on the Spider
Food site was to implement CSS across the entire site, and generally
streamline management. To accomplish this, I implemented custom
classes, and redefined the formatting for specific HTML elements.
This allowed me to remove ALL <font> tags, and sometimes cut
as much as 2K off a single page, just in reduced formatting.
We'll start the tutorial by teaching you how to add style sheets
into your page, and then we'll show you how to define your own classes.
Getting your Style Sheet into your page
A style sheet can either be coded directly into your HTML, or it
can be linked from a separate file. My personal recommendation is
to link your files, as this allows you to apply the same style sheet
to multiple documents.
To insert a style sheet into your document, you insert the <style>
tag into the HEAD of your document. Here's an example, using a snippet
of Spider Food's CSS file:
style definitions go here . . .
If you wanted to link your style sheet, you would save everything
between the <style> tags to a text file, with the .css extension.
You would then use the following code in the HEAD of your document:
<link rel="stylesheet" type="text/css" href="spider.css">
This pulls the style sheet into your page every time the page is
loaded. So if you had over 70 pages linked to one style sheet, as
we've done with this site, you could change the color of all your
links by changing just one file.
So now you're saying, "Dan, quit teasing, how the heck do I change
the color of my links???"
Click Next to find out . . .