類選擇器
通過點(.)和一個合法的字符串就可以定義一個類選擇器，例如:
.antzone
上面的代碼即是一個類選擇器，但是為了讓類選擇器有效，則需要在html元素中要有對應(yīng)類的定義，代碼如下:
<div id="antzone"></div>
代碼實例如下:
<style type="text/css">
.antzone{
width:100px;
height:100px;
}
</style>
<div class="antzone"></div>為了便于閱讀，上面的代碼進行了精簡，注意class屬性值前面不能加點(.)。也可以給同一個元素施加多個類選擇器，代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://ask.php.cn/" />
<title>php中文網(wǎng)</title>
<style type="text/css">
.antzone{
width:100px;
height:100px;
border:1px solid black;
}
.a{
color:red;
}
.b{
font-weight:bold;
}
</style>
</head>
<body>
<div class="antzone a b">php中文網(wǎng)</div>
</body>
</html>class屬性值每一個類用空格分隔即可，注意前面不能夠加點。
類選擇器也可以結(jié)合元素選擇器一起使用，例如在頁面中有多個元素同時使用了類"antzone"，但是有時候我們我只想針對class屬性值為antzone的div元素修改樣式，那么我們可以這樣寫:
div.antzone{
color:blue;
}以上代碼可以將具有class屬性值為antzone的div元素的字體顏色設(shè)置為藍(lán)色。
在上面的代碼中已經(jīng)介紹了，一個元素可以具有多個類名，中間用空格分隔，其實選擇器也可以使多個類連接起來代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://ask.php.cn/" />
<title>hp中文網(wǎng)</title>
<style type="text/css">
.antzone{
width:100px;
height:100px;
border:1px solid black;
}
.antzone.a{
color:blue;
}
</style>
</head>
<body>
<div class="antzone a b">php中文網(wǎng)</div>
<div class="antzone b">php中文網(wǎng)</div>
</body>
</html>以上代碼能夠?qū)⑼瑫r具有antzone和a類的元素有效。
有時候多個選擇器定義了相同的樣式屬性，如下:
.a{
width:100px;
height:100px;
}
.b{
width:100px;
height:100px;
color:red;
}以上代碼可以修改如下:
.a,.b{
width:100px;
height:100px;
}
.b{
color:red;
} 
