CSS Tutorial [page 2]

In the last tutorial I told you about the 5 ways to define a CSS style. In this tutorial I am going to show you how to use the powerful CSS option of classes. A class is a ruleset that defines certain characteristics that can be applied to any tag in a HTML document. Class declarations belong in a STYLE declaration in the HEAD of a HTML document. Then each individual tag can have the class that you define. Below is an example:

<HTML>
<HEAD>
<TITLE>CSS Class Tutorial</TITLE>
<STYLE> .redfont { color: red; } </STYLE> </HEAD>
<BODY>
<B CLASS="redfont">This is red!</B>
<FONT>This is NOT red!</FONT>
</BODY>
</HTML>

When you define a class it doesn't apply to any tag initially. You have to tell it which tags the class applies to. You do that by adding a CLASS property to the tag. The most important part of CSS classes is the period before the name in the STYLE declaration. NOTE: DO NOT FORGET THE PERIOD OR YOUR CLASS WILL NOT WORK.

Classes can be made to apply to only a certain tag. This is useful for having the same class, but have it do different things for different tags. It should look like this:

<HTML>
<HEAD>
<TITLE>CSS Class Tutorial</TITLE>
<STYLE> FONT.redfont { color: red; } </STYLE> </HEAD>
<BODY>
<B CLASS="redfont">This is not red!</B>
<FONT>This is NOT red!</FONT>
<FONT CLASS="redfont">This is red!</FONT>
</BODY>
</HTML>

Next I will show you how to define ID's and make them apply to certain tags or any tag using that ID.