Cascading
Style Sheets
Background:
More
than likely the inspiration for cascading style sheets came from desktop-publishing
software's growing ability to facilitate user determined styles.
Cascading style sheets allow Web designers to streamline their designs
by applying font, color, and margin choices to several pages at once.
But the HTML extension does a lot more than just save time. It allows
precise control of fonts and margins, and provides the ability to layer
words and graphics while simultaneously reducing download time.
Apart from aesthetic gains, the greatest benefit of stylesheets is their
efficiency. Multiple HTML documents can point at a single stylesheet and
by changing that one sheet, a designer could effectively change an entire
Web site.
You can appreciate that this can save countless hours of hand-coding.
How it works: You create standard HTML documents, marking them as you
normally would with paragraphs, headlines, and the like and then you write
a separate stylesheet that tells the browser how to render these pages
(For instance, you could make all the paragraphs appear in 12-point Times
Roman with 30 pixel margins, and all the <h2> headlines appear in green,
36-point Helvetica with 42 point leading).
A good tutorial for text styling with CSS in Dreamweaver 10 can be found at the Adobe site.
By pointing to this single stylesheet from the header of each document,
you can format all the pages in one action. The World Wide Web (W3) Consortium
developed stylesheets with the ambitious (and in hindsight idealistic)
hope of establishing a universal standard.
The problem is that this universal standard never eventuated. So you cannot
even assume that your stylesheet driven site will be viewed by someone
with a browser that recognizes this feature. But even if they do have
a stylesheet capable browser, it may not recognize all the tags.....hmmmm
CSS
capable browsers
So
here we go again....
By
now you are no stranger to the fact that the various competing browsers
have left a legacy of a vast array of compatibility differences(read problems)
behind.
Cascading
style sheets is one of the victims of this unwillingness to co-ordinate
and co-operate standards shown by most of the main browser makers. The
generation of older browsers which are still in use including Netscape
3.0 and Internet Navigator 3.0 recognize and/or support very few of the
CSS1 style specifications.
The
way style sheets work:
Local
Stylesheets:
are
used in single pages with the need to look different from other pages
on a site.
Internal
Stylesheets:
are
mainly for single pages with lots of style-change features.
External
Stylesheets:
is
a site-wide implementation and very useful for generating a "look". Each
single page is given a central resource page which contains the typographic
and other style conventions as a reference.
Specifics:
Some
more comments on the function and aesthetics of Stylesheets.
Some
examples of CSS implementation.
More
about style-sheets (including many useful links)
|