CSS類選擇器class用法探究
你對(duì)CSS類選擇其的概念和用法是否了解,這里和大家分享一下,希望對(duì)你的學(xué)習(xí)有所幫助。
CSS類選擇器class
在CSS中類選擇器以一個(gè)點(diǎn)號(hào)顯示:
- .center{text-align:center}
 
在上面的例子中,所有擁有center類的HTML元素均為居中。
在下面的HTML代碼中,h1和p元素都有center類。這意味著兩者都將遵守".center"選擇器中的規(guī)則。
- <h1classh1class="center">
 - Thisheadingwillbecenter-aligned
 - </h1>
 - <pclasspclass="center">
 - Thisparagraphwillalsobecenter-aligned.
 - </p>
 
注意:類名的***個(gè)字符不能使用數(shù)字!它無(wú)法在Mozilla或Firefox中起作用。
◆和id一樣,class也可被用作派生選擇器:
- .fancytd{
 - color:#f60;
 - background:#666;
 - }
 
在上面這個(gè)例子中,類名為fancy的更大的元素內(nèi)部的表格單元都會(huì)以灰色背景顯示橙色文字。(名為fancy的更大的元素可能是一個(gè)表格或者一個(gè)div)
◆元素也可以基于它們的類而被選擇:
- td.fancy{
 - color:#f60;
 - background:#666;
 - }
 
在上面的例子中,類名為fancy的表格單元將是帶有灰色背景的橙色。
<tdclass="fancy">你可以將類fancy分配給任何一個(gè)表格元素任意多的次數(shù)。那些以fancy標(biāo)注的單元格都會(huì)是帶有灰色背景的橙色。那些沒有被分配名為fancy的類的單元格不會(huì)受這條規(guī)則的影響。還有一點(diǎn)值得注意,class為fancy的段落也不會(huì)是帶有灰色背景的橙色,當(dāng)然,任何其他被標(biāo)注為fancy的元素也不會(huì)受這條規(guī)則的影響。這都是由于我們書寫這條規(guī)則的方式,這個(gè)效果被限制于被標(biāo)注為fancy的表格單元(即使用td元素來(lái)選擇fancy類)。
【編輯推薦】
- CSS border屬性邊框用法揭秘
 - IE6.0對(duì)padding的解讀分析
 - CSS樣式表高效使用八大秘訣
 - 實(shí)現(xiàn)CSS垂直居中的五大方法及優(yōu)缺點(diǎn)
 - IE6中常見CSS兼容性解決十大技巧
 















 
 
 


 
 
 
 