More Than One Class for HTML Tag

Perm url with updates: http://xahlee.org/js/html_more_than_one_class.html

More Than One Class for HTML Tag

Xah Lee, 2010-10-06

This page is a tutorial on HTML.

You can specify more than one class for a html tag, using space as separators, like this:

<span class="bk1 bk2">Alice In Wonderland</span>

You should not use multiple “class” attributes.

<span class="bk1" class="bk2">INCORRECT! INVALID! WRONG!</span>

The order of your class values does not matter.

If you have styles that conflict, such as:

.bk1 {color:blue}
.bk2 {color:red}

The last css takes priority. (in general, css conflicts are resolved by complicated CSS priority rules)

Here's code you can test yourself:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Test HTML</title>
<style type="text/css">
.bk1 {color:blue}
.bk2 {color:red}
</style>
</head>
<body>
<p class="bk1 bk2">Something</p>
</body>
</html>
Was this page useful? If so, please do donate $3, thank you donors!

Popular posts from this blog

Browser User Agent Strings 2012

11 Years of Writing About Emacs

does md5 creates more randomness?