CSS - An Overview

 
Featuring: CSS-Cascading Style Sheets - Overview
Credit:Imagenation

One of the driving goals in IT has been to separate programming and code from data; in a like fashion one of the key designs in Web development is to separate structure and styling from content in HTML. CSS-Cacading Style Sheets goes a long way towards separating out styling info from content. And CSS is a "cascading" design(specific stylesheet definitions override or cascade over more general or outer HTML tag styles. So the style set in a <body style=...> tag is overidden by the style set in a <p style=...> tag, etc.); thus Web designers have great flexibility in how they use CSS.

The second key feature of CSS is that the style directives can be stored away in a separate .css file and then included in your HTML file using either:
  1)<link href="osstyle.css" rel="stylesheet" type="text/css"> statement in the <head> section of
  your html page;
  2)or using @import url(osstyle.css); in the <style> part of your <head> section.
What this means of course is that the same style can then be applied to many HTML pages. This also simplifies making style changes across a website - one change to a .css file rather than dozens scattered throughout many web pages.

The third key feature of CSS has already been implied above - that users can change and customize for their web documents how specific HTML tags like <body>, <div>, <h1>, <h2>, <h3>, <p>, <span> and other tags will work. It is as if users had control of the definitions of the HTML tags - which of course they do through CSS.

Unfortunately, Cascading Style Sheets, like JavaScript and the other ingredients of DOM, have been badly victimized by the browser wars. The 4.x Netscape only partly implemented CSS (the new Mozilla based Netscape 6 & 7 more than make up for these omissions). Microsoft did its proprietary thing and added "tweaks" that were not part of the CSS standard and is still the most remiss in implementing full CSS 1 & 2. So Web designers learned by bitter, page layout fiascoes to shy away from any but the most basic CSS features.

Well the new browsers, especially Mozilla/Netscape, Opera and Apple's new Safari ( and some but not all of IE 5 and 6) change all that. Almost all of CSS 1 and a good start on CSS 2 are implemented. This means that Web Designers can confidently implement sophisticated backgrounds, highlighting, simple stylish menus, useful tabs and some delightful text formatting without having to resort to JavaScript and/or cookies which browser users can now turn off. And these elements will execute faster because they are in the browser parser - especially when a .css style file is used for many pages. In short, the time has come for CSS. And some of the gorgeous designs and useful features possible with CSS are well worth the learning effort.

 
Top of Page  Tutorials Home  CSS References