A Central Location

design

#1

Just as style sheets allow Website Design CA to put formatting code in one location in your document, you can also separate out your style sheet and put it in a separate file. Then load the style sheet into your document with a simple tag in the head of your document. So, for example, if you save your style sheet in a file called “formatting.css”, then you might put a tag like the following in the HEAD section of your document:

How is this useful? It is useful when you want to apply a standard style across all the documents on your website. This way, when you want to make a change in say the colour of a table background, all you need to do is to modify your style sheet, and all your documents will automatically have the new appearance.
No longer is there any need of going through every single file on your website to make the changes, and accidentally forgetting one.

With older browsers, if you wanted to position certain elements you had to either resort to using tables or use browser dependent facilities like layers. Cascading Style Sheets allow you to create and position layers in a manner that works with all CSS-compliant browsers.

You can even position any text element without resorting to a table, and create interesting text effects. Take, for example, the following code which is to be placed into a style sheet.

.bannermain {
font-family: Arial Black ;
margin-left: 10px ;
color: green ;
font-size: 28px ;
}

.bannershadow {
font-family: Arial Black ;
margin-left: 8px ;
margin-top: -38px ;
color: darkgreen ;
font-size: 28px ;
}
The HTML code to utilize the above style sheet might look like the following:

My First Website
My First Website

When the text is displayed, you get a large green “My First Website” text which has a dark green shadow. If you put it into a coloured box, you can actually produce a “banner” without even needing a graphics file.