Web Design: Style Sheets

Read at your own risk

This document dates from the early web period, and is kept for archival purposes only. It is no longer updated, and contains much that is apocryphal, or at least wildly inaccurate.
  1. Java is an Island
  2. Web Design
  3. All the News that Fits the Page

“Style Sheets”, or “Cascading Style Sheets”, allow you to create your own HTML tags. You can create a style that typographically means “bold, slightly bigger, and indented”, or a style that typographically means “superscripted and light green”. Style sheets are very useful. You can (and should, if you use them) create a single style sheet and apply it to multiple web pages—and then easily change the “style” of those web pages by changing that single style sheet. But remember that styles do not convey meaning.

Even if you decide to use cascading style sheets to give yourself more control over your document, you should modify html tags that have meaning. If you’re creating a new way of displaying emphasized words, modify the “em” tag. If you’re creating a new way of displaying quotes, modify the “blockquote” tag. Let browsers easily determine the meaning behind your style.

You can embed styles within your web pages, or you can separate the styles from the page, and store the styles in a separate file on your web site. This is almost always the better choice. It allows you to both easily change, and convey consistency cross, your web pages. The tag that “links” a web page to a separate (“external”) style sheet is the “<link>” tag:

<LINK REL=StyleSheet HREF="/css/FireBlade.css" TYPE="text/css" MEDIA="screen">

The “HREF” option is the URL to the external style sheet. If you are part of a group project, you can even link to a global style sheet on a different web site.

  1. Java is an Island
  2. Web Design
  3. All the News that Fits the Page