Introduction to HTML
Scripting & Programming
Languages and Environments

Cascading Style Sheets
Copyright © 2000 - 2002 Randy D. Ralph.  All rights reserved.
  RETURN Course Contents  
In place June 3, 2000.

Overview:

Standard HTML does not provide for the definition of styles which can be applied to parts of an HTML Document in the way that styles can be used in most current word processors or desktop publishing applications.  In standard HTML fine control over placement of elements, fonts, color and spacing is problematic because of the limitations of the language and its elements.  The DHTML environment, however, includes support for CSS (Cascading Style Sheets) which allow much greater control over the stylistic content of a webpage.

CSS permits the definition of complex styles which can be implemented at any point within an HTML Document to enrich a website.  Styles can be incorporated directly into the <HEAD> document segment of an HTML Document.  A set of defined styles can also be saved as an independent text file and applied to a number of HTML Documents by reference to the external style document. 

At the present time support for CSS is limited to the Internet Explorer browser version 3.0 and higher and the Netscape browser 4.0 and higher.  The styles defined are invisible to lower end browsers.  This means that standard HTML formatting commands still need to be included in CSS-enriched webpages for backward compatibility.

CSS is gaining popularity and several 4th or 5th generation browsers can interpret it.  W3C has recommended CSS Level 1 for inclusion in the specifications for HTML 4.0.  Since support for CSS is still far from universal and the specifications are still under development, it is probably wise, for the present, not to incorporate CSS into a website.

Examples:


 
Code -

<HEAD> <STYLE TYPE="text/css"> <!-- P {text-indent: 10pt} --> </STYLE> </HEAD>
Definition -

  • The style declaration resides within the Head Document Segment.
  • Defines the style as applying to text and the language as CSS.
  • Declares that the HTML command <P> will produce indented text in the default font at 10 point.

 
Code - <HEAD> <STYLE TYPE="text/css"> <!-- H3 { font-family: Arial; font-style: italic; color: green } --> </STYLE> </HEAD> Definition -

  • The style declaration resides within the Head Document Segment.
  • Defines the style as applying to text and the language as CSS.
  • Declares that the HTML command <H3> will produce italicized green text in the Arial font.

 
The CSS scripting language is complex and powerful.  Coding in CSS is not difficult but the language requires significant independent study.  A full discussion of the capabilities of the language and its use are beyond the scope of this introductory HTML course.

See the sources listed below for more information.


Selected Print Resources:

Jones, Joseph R. and Paul Thurrott.  1997.  Cascading style 
    sheets: a primer.  New York: MIS:Press.
    TK5105.888

Lie, Hakon Wium and Bert Bos.  1997.  Cascading style sheets: 
    designing for the Web.  Reading, MA: Addison Wesley 
    Longman.
    TK5105.888

Livingston, Dan and Micah Brown.  1999.   Essential  CSS  and  
    DHTML for Web professionals.  Upper Saddle River, NJ: 
    Prentice Hall PTR.
    QA76.76.H94 L58 1999

Meyer, Eric. A.  2000.  Cascading style sheets: the 
    definitive guide.  Cambridge, MA: O'Reilly.
    QA76.76.H94 M47 2000

Sengili-Roberts, Keith.  2000.  Core CSS.  Upper Saddle 
    River, NJ: Prentice Hall PTR.
    TK5105.888. S32 2000

Selected Web Resources:

  RETURN Course Contents  
You are here:  NetStrider   »   Tutorials   »   HTML   »   Scripting   »   CSS   «