CSS Classes, What are they? How do i use them?

Jeff Andersen (CSS / Beginner)

Classes are a method of using CSS to apply various styles to HTML elements. If you had a two paragraphs of text and wanted one to look different that the other then classes would be a good idea. Here is how you'd go about doing this.

What you need to do is think initially of a name you're going to use for this class. Try to be specific so if someone else comes and looks at your code they know what you mean and can easily change something. To start off we are going to apply a class that works with any p (paragraph) that has the class tag applied to it.
p.redbold {
We start this by stating that if there is a paragraph (p), with the class name (.redbold), it should set the following.
color: red; font-weight: bold; }
And there you go, that is your first class pertaining to a paragraph. To use this class it's very easy, all you have to do is add in the class= code to each paragraph you'd like to be red and bold.
<p class="redbold">This text will now be bold and red</p>
See how easy that is? Now, to set a class so that it can work with any type of HTML element you can use the same method, but without including the p, this allows you so that you can set it to anything from header tags to form elements.
.redbold { color: red; font-weight: bold; }


© Copyright 2006 - All Rights Reserved - SiteGuts is a part of the Enthonia Content Network