Westciv Logo

These materials are copyright Western Civilisation Pty Ltd.

www.westciv.com

They are brought to you courtesy of Style Master CSS Editor and Westciv's standards based web development courses.

Please see our website for detailed copyright information or contact us [email protected].

complete css guide

<< css intro | what's a style sheet? >>

Why use css?

Style sheets exist, above all, to enable the following principle to be put into practice.

Web pages should separate content from appearance.

As a developer this means that the information in your web site should go into your HTML files, but HTML files should not contain information about how that information is displayed. And you've probably guessed by now that information about how the pages should appear goes into CSS files.

You might wonder what advantages this conveys. Why go to all of this trouble? Just a couple of advantages might give you an idea about why this approach has long been considered beneficial in areas of document management that have been around a lot longer than the world wide web.

The traditional HTML approach was to "hardcode" all of the appearance information about a page. So you want all your headings in courier, and at different point sizes to the sizes built into browsers? Then, for every heading, in every page, set the font size and face properties. You've got more than 100 pages? That is a lot of editing, and a lot of re-editing if you decide to modify the appearance of your pages later. And with all of that editing there is plenty of possibility for introducing errors.

With CSS, you can decide how headings should appear, and enter that information once. Every heading in every page that is linked to this style sheet now has that appearance. Want to make every heading of level 3 more obviously different from those of level 2? Edit the style sheet, and every such heading now has the altered appearance. How many hours' work (and potential errors) have you just saved?

Another major advantage involves the management of large, sophisticated sites. With cascading style sheets, whole organizations can share a small number of style sheets, ensuring consistency across the site with no need for constant updating and editing to accommodate changes. For a discussion of this advantage in detail, see Managing Style at Large Sites, in the section on cascade and inheritance.

There are plenty of other advantages, too. We return to this issue in more detail in the real world CSS section of the guide. For now though, let's find out what a style sheet actually is and how it performs all these miracles.

<< css intro | what's a style sheet? >>