Benefits of Style Sheets

HTML in its pre-web form was designed to enable only the meaning of text phrases to be defined – any mention of formatting was explicitly left out. The idea was that each viewer of an HTML page would be free to set the specific formatting they preferred for each functional element. Users with high resolution color monitors could view their pages one way, and those with monochrome text only displays could view them in another.

The web adopted HTML, which quickly evolved, and browser manufacturers soon began to add additional capabilities to existing tags and even new tags themselves to enable web authors to add formatting to their pages. Just as quickly as these tags proliferated they started to detract from the content/formatting division so important to HTML. But, while these tags gave some improved control over the appearance of HTML, they weren't enough to remedy the problem, since authors continued to replace lengthy blocks of text with graphics when they weren't able to create the effect they wanted with new tags.

Fortunately, style sheets overcome these problems while at the same time adding even more features: everything a layout artist could want. However, they still give the user some control over the browser presentation of different HTML.

General HTML Benefits

Style sheets enable the separation of content and formatting in HTML documents. In fact, styles can be so separate from the HTML pages that use them that we can even define them in another file. With styles characterized in a separate file, they can easily be applied to more than one document – a great advantage.

Wherever we define as our styles, we know that they won't alter the text in any way. This means that people with text-only browsers (and browsers that don't support style sheets) will still be able to see all of the content – it just might not look quite as good.

But these advantages wouldn't mean anything at all if the first purpose of style sheets, to give web developers greater control over the appearance of their pages, wasn't met. As we'll see, style sheets do indeed make pages with all kinds of objects possible in any location we desire.

New Uses for Dynamic HTML

All of this is great, but you need to consider how style sheets apply to the topic at hand. If text and other elements are statically placed when the page is loaded, can we really call it Dynamic HTML? We don't need to argue about this point, because our elements aren't statically arranged – they can be moved and their display properties can be changed. These features are all due to the object model, styles and script code. Before we get into a description of how style sheets work and how they relate to Dynamic HTML, let's get a small taste of what they can do for us.