<html> Unit 10

Doing It in Style

 

This Week's Goals:

Style Sheets give web designers flexibility and control. Many designers hesitated to use this new technique because browsers have not supported the standard. However, the 4.0+ versions of Netscape and Explorer do support many of the important elements. This week you will learn how to embed a style sheet in the head of your document, how to link your document to a separate style sheet, and what style sheet elements can be safely used during this transitional period for browsers. This week all the attention you paid to structural tags will pay off!

What to do This Week:

1. Try looking at the following alternative versions of this page:

  1. Version Two for a Livelier Variation
  2. Version Three for Crayon Box Approach
  3. Version Four for Vision-Impaired Viewers

Do you see a difference? If you are using a late-model browser, you should be able to see very different versions of the same page. Try to look at the pages in both Netscape and Explorer, as well as Opera and Lynx if they are available. You will see that Explorer does support more features of style sheets than does Netscape.

2. Use View>Page Source to examine the code for this page. What differences do you notice in the code? How does the code differ in the other versions?

3. Read the following articles on the web:

  1. Tutorial on Style Sheets at Dr. Web
  2. Fear of Style Sheets - Part 1and 2 at A List Apart
  3. Steve Mulder tutorial on Style Sheets at Webmonkey may also answer some of your questions.

I think that Chapter 11 of Raggett on HTML 4 about style sheets is somewhat overwhelming so do not make it required reading. However, you will want to use it as a resource. Read about style sheets in the text of your choice.

4. Read the comments about <style> sheets in the link below.

5. Try the quiz if you find that useful.

   

This week's submission

6. Do this week's submission and post it on the web. If you need help, post your question to the ListServ with the topic of your message marked "Help for Unit 10."

 

Readings
Resources
<head>
<p> etc.
<b> etc.
<li> etc.
<a href>
<img src>
Access
<table>
<frame>
<style>
<form>
<script>
<object>
validate

Copyright by dwang, 1999. All rights reserved.

Valid HTML 4.0!