Resources

Here are more articles:  

Adding a Touch of Style:  http://www.w3.org/MarkUp/Guide/Style.html 

HTML with Style:  http://www.webreference.com/html/tutorial5/

WebsiteTips.com: http://www.websitetips.com/html/index2.html#css

Style Sheets Tutorial:  

http://hotwired.lycos.com/webmonkey/authoring/stylesheets/tutorials/tutorial1.html 

CSS and DHML: http://htmlgoodies.earthweb.com/beyond/css.html 

CSS bugs:  http://css.nu/pointers/bugs.html 

CSS2: http://hotwired.lycos.com/webmonkey/98/15/index4a_page2.html?tw=authoring 

CSS Pointers for Practical Use;  http://www.css.nu/ 
(has some great links, including an example page and some sample CSS sheets)

What works in what browser:  http://www.webreview.com/style/css2/charts/selectors.shtml 

Http://www.fortnet.com/FortNet/HTML/Presentation/style/syntax.html 

Http://www.htmlhelp.com/reference/css/quick-tutorial.html 

Click here for CSS for FrontPage users.  

Click here  for a browser detection script to redirect Netscape 4 users.

http://www.w3schools.com/css/css_books.asp 

Everything you ever wanted to know about Style

http://www.westciv.com/style_master/academy/css_tutorial/index.html 

CSS-P: How to build a web site without tables

http://www.mako4css.com/Tutorial.htm 

Positioning with CSS 2

Toss out your Tables! CSS is the scene!

http://wdvl.internet.com/Authoring/Style/Sheets/Positioning/Toss/index.html 

A great series of Editorials

http://www.wpdfd.com/editorial/wpd0402.htm#feature

Questions?

How is the logo done?

<STYLE>

BODY { background: url(images/phoebe1.jpg) white no-repeat bottom right fixed }

</STYLE>

</head>

How is the larger link done?

I bet you can guess - it is a function of a: hover

a:hover {color: blue; text-decoration : none; font-size : 18pt; font-weight :bold; line-height: 21pt }

How about the scrollbar color?

<style type="text/css">
BODY {
scrollbar-face-color: #7AC5CD;
scrollbar-3dlight-color: #EFE6C9;
scrollbar-darkshadow-color: #B4EEB4;
scrollbar-track-color:#78C4D0;
scrollbar-arrow-color: #EFE6C9;}
</style>
</head>

OR

<style type="text/css">
body {
scrollbar-face-color: #AC4F00;
scrollbar-shadow-color: #670000;
scrollbar-highlight-color: #ECBA87;
scrollbar-3dlight-color: #ECBA87;
scrollbar-darkshadow-color: #670000;
scrollbar-track-color: #9D3600;
scrollbar-arrow-color: #228B22; }
</style>

For more information, check the Microsoft site.

How do I get links to show a background color when the cursor is over them?

A:link:hover, A:visited: hover{background: yellow}

How about a dropcap?  (Hint:  it's a class)

<style>
.dropcapparagraph:first-letter
{
font-size:300%;
font-style:italic;
font-weight:bold;
float:left;
color:black;
}
</style> 

Now, use the class .dropcapparagraph.  (<p class="dropcapparagraph">)  For example, see the first page.

Netscape isn't displaying my tables correctly. What am I doing wrong?

Netscape does not apply the BODY style to tables. To work around this, add TD to your BODY selector, like so:

BODY, TD { font-family: sans-serif; }