I found this in my files at work today. I don’t know when or why I wrote it, but it might be of use to someone….
CSS is a badly named, very powerful tool for controlling the look of your site. CSS is good for making site-wide style definitions. You can replace a common font declaration with:
p {
font-size: medium;
color: #003;
}
Because this defines everything enclosed by paragraph tags, you no longer need to use font tags to control the display of your text.
(I should point out here, for the people who are staring at #003 and scratching their heads: CSS lets you use shortcuts for hex color values if all your numbers are in pairs. #000033 -> #003, #ff0000 -> #f00, etc.)
You can define more than one tag at a time:
p, li, dd {
font-size: medium;
color: #003;
}
Imagine that you want a black border and a two-pixel space around all images on your site. Write:
img {
border: 1px solid #000;
margin: 2px;
}
Want that space inside the black border instead?
img {
border: 1px solid #000;
padding: 2px;
}
Imagine that your boss decides that all headers will now be maroon instead of blue. You can add
h1, h2, h3, h4, h5, h6 {
color: #600;
}
to your stylesheet, and the change is applied across all your pages without your having to open and edit each one.
Applying the CSS to all your documents is easy if you have an authoring tool that allows global search-and-replace. Search for:
And replace it with:
For more detailed and extensive CSS information, see the following sites:
CSS-Discuss mailing list (check out the wiki!)