大家看了就明白了css樣式中類(lèi)class與標(biāo)識(shí)id選擇符的區(qū)別小結(jié)
更新時(shí)間:2007年12月09日 14:10:35 作者:
你可以用類(lèi)選擇符class和標(biāo)識(shí)選擇符id來(lái)定義自己的選擇符。
這樣做的好處是,依賴于class或者id,你可以不同地表現(xiàn)相同的HTML元素。
在CSS中,類(lèi)選擇符在一個(gè)半角英文句點(diǎn)(.)之前,而id則在半角英文井號(hào)(#)之前。
看起來(lái)像這樣:
#top { background-color: #ccc; padding: 1em } .intro { color: red; font-weight: bold; }
HTML與CSS的連接用屬性id和class。像這樣:
<div id="top"> <h1>Chocolate curry</h1> <p class="intro">This is my recipe for making curry purely with chocolate</p> <p class="intro">Mmm mm mmmmm</p> </div>
id和class不同之處在于,id用在唯一的元素上,而class則用在不止一個(gè)的元素上。
你也可以為一個(gè)指定的HTML元素應(yīng)用選擇符,把HTML選擇符放置在前面就可以了,所以, p.jam { whatever }會(huì)應(yīng)用在有類(lèi)“jam”的段落上。
一個(gè)id名稱(chēng)在一個(gè)頁(yè)面里面通常是唯一定義的,因此在頁(yè)面里定義css通常建議使用class,這樣你可以重復(fù)使用你的css. 而把id留給最需要使用html元素的javascript等
這樣做的好處是,依賴于class或者id,你可以不同地表現(xiàn)相同的HTML元素。
在CSS中,類(lèi)選擇符在一個(gè)半角英文句點(diǎn)(.)之前,而id則在半角英文井號(hào)(#)之前。
看起來(lái)像這樣:
#top { background-color: #ccc; padding: 1em } .intro { color: red; font-weight: bold; }
HTML與CSS的連接用屬性id和class。像這樣:
<div id="top"> <h1>Chocolate curry</h1> <p class="intro">This is my recipe for making curry purely with chocolate</p> <p class="intro">Mmm mm mmmmm</p> </div>
id和class不同之處在于,id用在唯一的元素上,而class則用在不止一個(gè)的元素上。
你也可以為一個(gè)指定的HTML元素應(yīng)用選擇符,把HTML選擇符放置在前面就可以了,所以, p.jam { whatever }會(huì)應(yīng)用在有類(lèi)“jam”的段落上。
一個(gè)id名稱(chēng)在一個(gè)頁(yè)面里面通常是唯一定義的,因此在頁(yè)面里定義css通常建議使用class,這樣你可以重復(fù)使用你的css. 而把id留給最需要使用html元素的javascript等
相關(guān)文章
仿客齊集首頁(yè)導(dǎo)航條DIV+CSS+JS [代碼實(shí)例]
仿客齊集首頁(yè)導(dǎo)航條DIV+CSS+JS [代碼實(shí)例]...2007-04-04
CSSvista可同時(shí)在IE和Fifrefox調(diào)試的CSS編輯提供下載
CSSvista:可同時(shí)在IE和Fifrefox調(diào)試的CSS編輯器 CSSvista是一個(gè)免費(fèi)的Windows增強(qiáng)應(yīng)用程序,為Web開(kāi)發(fā)人員準(zhǔn)備的一個(gè)CSS編輯器。它可以讓你同時(shí)在IE和Firefox下調(diào)試你的CSS樣式表代碼。2008-06-06
web標(biāo)準(zhǔn)常見(jiàn)問(wèn)題集合5
web標(biāo)準(zhǔn)常見(jiàn)問(wèn)題集合5...2006-12-12
CSS學(xué)習(xí)筆記Padding 屬性中參數(shù)的定義與使用
css padding縮寫(xiě)技巧2008-05-05
激發(fā)你的靈感:50個(gè)優(yōu)秀的Favicons
激發(fā)你的靈感:50個(gè)優(yōu)秀的Favicons...2007-02-02

