Cascading style sheets (CSS) are a relatively new development in the HTML world. They're much easier to learn than e.g. JavaScript and much more useful, too. Invented to give professional web designers more possibilities for page layout, especially if multiple pages are to have the same layout, they offer loads of new features fit to make the eyes of professional web amateurs ;) sparkle with delight.
Instead of wasting keystrokes on describing what style sheets offer, let me show you on a sample page. For the full experience, you should use MSIE or Netscape version 4.x or higher and load images. sample page
There's only one drawback: compatibility. Of the standard bowsers, Internet Explorer 3.x, 4.x and Netscape 4.x are capable of displaying style sheets. All of them allow to disable CSS, and all of them still have more or less difficulties with some style sheet definitions. Anyway, I love the features style sheets offer, I love experimenting - so I use them, although carefully. It is still a good idea to combine both the usual HTML and style sheets for layout, just to be sure.
Be warned before you begin: Porting existing webpages from pure HTML to style sheets requires a lot of testing both the HTML and style sheet version and cleaning up the HTML code. "Hacks" used to format HTML in a way the tags aren't meant to be used, like <ul> to achieve left indentation, can lead to surprising and unwanted results in style sheet versions.
You might also want to reconsider the use of seemingly interchangeable tags like <strong>, <em> and <b>, all resulting in bold script. With style sheets, they can be assigned three different appearances!
This tutorial almost exclusively deals with features that can be interpreted both by MSIE and Netscape and, according to my experiments, make sense in combination with HTML layouts.
And one more thing: In order to put style sheets to a sensible use, you should be fluent enough in HTML to understand the meaning of most HTML tags and - important! - the relation between them.
But now, enough of preliminary consideration. Bring on the instructions!
Get your own Free Home Page