Cascading Style Sheets

CSS is a simple style sheet mechanism that allows authors and readers to attach style to HTML documents. CSS uses common desktop publishing terminology which should make it easy for professional as well as untrained designers to make use of its features. Visual design issues, such as page layout, can now be addressed separately from the web page logical structure.

HTML

is notoriously poor at 'desktop publishing' quality layout. It was never designed for that, having its roots in the scientific research domain where content is far more important. But people were keen to create 'cool' pages and bent HTML to their will by using common side-effects of certain tags, e.g. BLOCKQUOTE to get margins or indenting, or header tags for font sizing. This happens to work in the Big Two, but isn't guaranteed to do that for all browsers - it's not required by the standards. Now in many cases people have had little choice but to misuse tags to get the rendering effects they wanted, but unfortunately the consequences were undesirable.

The problem is not just that GUI browsers other than MS and NS might render headings, blockquotes etc differently - but also that other software, e.g. search engines and text to speech browsers for the blind, may take the wrong cues. Search engines give extra weight to words in headings, and text-to-speech might announce that there is a quotation where there isn't, for example.

So the use of HTML tags for their commonest rendering (side-)effects may lead to confusion; the safest course is to use HTML tags for their original purpose and use style sheets to deal with the presentation issues. Style sheets will be the best solution once browsers that support them are widely deployed. They separate presentation directives from structural markup and are explicitly designed to address the presentation issues.

Style sheets describe how documents are presented on screens, in print, or perhaps how they are pronounced. Style sheets are templates, very similar to templates in desktop publishing applications, containing a collection of rules specifying the rendering of various HTML elements. By attaching style sheets to structured documents on the Web (e.g. HTML), authors and readers can influence the presentation of documents without sacrificing device-independence or adding new HTML tags.

W3C issues CSS2 as a W3C Recommendation The World Wide Web Consortium (W3C) has released the CSS2 (Cascading Style Sheets, level 2) specification as a W3C Recommendation. The CSS2 specification represents a cross-industry agreement on a wide range of features for richer and more accessible Web pages. CSS2 includes all the capabilities of CSS1 and adds improved typographic control, including dynamically downloadable fonts. There are new positioning properties to control layout; for example, to produce sidebars and navigation areas. Images and text can be layered and overlapped and can be dynamically moved around the screen with scripts. CSS2 also adds control over table layout, particularly useful for XML documents, and allows the automatic numbering of headings and lists. The CSS2 Recommendation is supported by the W3C CSS2 Package, consisting of the CSS2 Validation Service, a set of W3C Core Style Sheets, and the CSS Test Suite. The CSS2 Package will help document authors use CSS2 and also help developers create CSS2-compliant software.

Benefits	Why do we need Style Sheets?
Tutorial	A simple introduction.
Our Book Recommendation	Cascading Style Sheets - Designing for the Web . by Håkon Wium Lie and Bert Bos of the World Wide Web Consortium.
Setting Colors and Fonts	The ability to set colors and fonts is slated to disappear from HTML (4.0), in favor of these style sheet methods.
Positioning with Layers	A brief introduction to layers positioning; more to follow..
The WDVL Style Sheet	We use it ourselves..
Resources	Further reading.

When authoring HTML with style, you might use cascading style sheets, or graphics tools to create background images, icons, 3d graphics. Multimedia can help to animate them, e.g. using GIF animation or Java applets. For interactivity use forms processed by JavaScript or CGI software. Use META tags to help search engines find you on the Internet. Our reference index or the WWW-VL can help you locate more.