你對(duì)CSS類(lèi)選擇其的概念和用法是否了解，這里和大家分享一下，希望對(duì)你的學(xué)習(xí)有所幫助。

CSS類(lèi)選擇器class

在CSS中類(lèi)選擇器以一個(gè)點(diǎn)號(hào)顯示：

.center{text-align:center}  
 

在上面的例子中，所有擁有center類(lèi)的HTML元素均為居中。

在下面的HTML代碼中，h1和p元素都有center類(lèi)。這意味著兩者都將遵守".center"選擇器中的規(guī)則。

<h1classh1class="center"> 
Thisheadingwillbecenter-aligned  
</h1> 
 
<pclasspclass="center"> 
Thisparagraphwillalsobecenter-aligned.  
</p> 
 

注意：類(lèi)名的***個(gè)字符不能使用數(shù)字！它無(wú)法在Mozilla或Firefox中起作用。

◆和id一樣，class也可被用作派生選擇器：

.fancytd{  
 color:#f60;  
 background:#666;  
 }  
 

在上面這個(gè)例子中，類(lèi)名為fancy的更大的元素內(nèi)部的表格單元都會(huì)以灰色背景顯示橙色文字。（名為fancy的更大的元素可能是一個(gè)表格或者一個(gè)div）

◆元素也可以基于它們的類(lèi)而被選擇：

td.fancy{  
 color:#f60;  
 background:#666;  
 }  
 

在上面的例子中，類(lèi)名為fancy的表格單元將是帶有灰色背景的橙色。

<tdclass="fancy">你可以將類(lèi)fancy分配給任何一個(gè)表格元素任意多的次數(shù)。那些以fancy標(biāo)注的單元格都會(huì)是帶有灰色背景的橙色。那些沒(méi)有被分配名為fancy的類(lèi)的單元格不會(huì)受這條規(guī)則的影響。還有一點(diǎn)值得注意，class為fancy的段落也不會(huì)是帶有灰色背景的橙色，當(dāng)然，任何其他被標(biāo)注為fancy的元素也不會(huì)受這條規(guī)則的影響。這都是由于我們書(shū)寫(xiě)這條規(guī)則的方式，這個(gè)效果被限制于被標(biāo)注為fancy的表格單元（即使用td元素來(lái)選擇fancy類(lèi)）。

【編輯推薦】

1. CSS border屬性邊框用法揭秘
2. IE6.0對(duì)padding的解讀分析
3. CSS樣式表高效使用八大秘訣
4. 實(shí)現(xiàn)CSS垂直居中的五大方法及優(yōu)缺點(diǎn)
5. IE6中常見(jiàn)CSS兼容性解決十大技巧