Glossary

NEWS & TIPS

  • Site Access Keys
  • Top: Alt+t
    Previous: Alt+,
    Next: Alt+.
    Up: Alt+;
    (Note: use Ctrl on the Mac)

CSS

The term CSS refers to a Cascading Style Sheet, which is the standard method for styling the appearance of a website. Cascading Style Sheets effectively separate the code needed to create the look and feel of a website from the actual XHTML tags that define the structure of its pages. When designing a website, it is important to separate the concepts of presentation and structure, because a site can quickly become very hard to maintain when a designer mistakenly combines them together. Because CSS properties reside inside an independent file, multiple pages within a single website can simply link to it to receive the style definitions that dictate the appearance and positions of elements on a page. When a website designer uses this modular approach to site development, it is easy to change the properties of all pages within a site by making a simple edit to the single CSS file to which all of the pages link.

Example XHTML and CSS


The XHTML below represents a simple webpage document that has a single paragraph in its body. Without any CSS styles, the page would have a plain, white background and the standard web browser font (Times New Roman in many cases).

XHTML Page (index.html)

The CSS file defined below contains two CSS definitions that could be applied to an XHTML document and any others in the website that contain the <body> and <p> elements. The highlighted, red <link> tag in the XHTML document demonstrates how a designer would link the particular page to the CSS file. Since the example XHTML document links with the example CSS file, the background of the webpage will be blue with the page text appearing in the Arial font with an 11-pixel letter height. Likewise, the paragraph in the body of the document would have a 10-pixel margin on all sides, and its text color will be white.

Cascading Style Sheet (styles.css)

See Also

Last modified on Mon, 11 Aug 2008 10:29:04 -0400

Topic Feedback Form

Content Rating:
Email:
Feedback:


Top / Previous / Next / Up / Table of Contents