You are currently browsing the page Classes in the CSS category.

Classes

When you make a stylesheet, using only selectors might be troublesome. For example, if you use this code:

p {
font-family: arial;
font-size:12pt;
}

Then all your paragraphes will be with these settings. You can customize a little more by doing this:

p.times {
font-family: Times;
font-size: 15px;
}
p.arial {
font-family: Arial;
font-size:12pt;
}

In your p tag, add this:

<p class="times">This paragraph uses the Times font and its text size is 15px.</p>
<p class="arial">This paragraph uses the Arial font and its text size is 12pt.</p>

If you want your class to be used by other tags than paragraphs, just remove the p in the stylesheet. For example:

.times {
font-family: Times;
font-size: 15px;
}
.arial {
font-family: Arial;
font-size:12pt;
}

Now the class can be applied to div layers, etc.

Classes can be used how many times you want in a page. IDs, on the contrary, can be used only once. You can also apply multiple class to your tags, just by adding a space between them. For example:

<p class="class1 class2">Lorem ipsum</p>

Print This Post Print This Post



Sponsors


Leave a Comment

Works? Doesn't work? Other tips? Please leave a comment! :)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

To post codes, please go to SimpleCode and transform your codes first, so that it will displayed properly. Indeed, < and > need to be converted to &lt; and &gt; :)


Close
E-mail It