div+css中Class與ID的區(qū)別
更新時(shí)間：2007年04月08日 00:00:00 作者：
一個(gè)Class是用來(lái)根據(jù)用戶定義的標(biāo)準(zhǔn)對(duì)一個(gè)或多個(gè)元素進(jìn)行定義的。打個(gè)比較恰當(dāng)?shù)谋确骄褪莿”荆阂粋€(gè)Class可以定義劇本中每個(gè)人物的故事線，你可以通過(guò)CSS，Javascript等來(lái)使用這個(gè)類。因此你可以在一個(gè)頁(yè)面上使用class="Frodo" ，class="Gandalf"，class="Aragorn"來(lái)區(qū)分不同的故事線。還有一點(diǎn)非常重要的是你可以在一個(gè)文檔中使用任意次數(shù)的Class。
至于ID，通常用于定義頁(yè)面上一個(gè)僅出現(xiàn)一次的標(biāo)記。在對(duì)頁(yè)面排版進(jìn)行結(jié)構(gòu)化布局時(shí)（比如說(shuō)通常一個(gè)頁(yè)面都是由一個(gè)頁(yè)眉，一個(gè)報(bào)頭<masthead>，一個(gè)內(nèi)容區(qū)域和一個(gè)頁(yè)腳等組成），一般使用ID比較理想，因?yàn)橐粋€(gè)ID在一個(gè)文檔中只能被使用一次。而這些元素在同一頁(yè)面中很少會(huì)出現(xiàn)大于一次的情況。
歸納成一句話就是：Class可以反復(fù)使用而ID在一個(gè)頁(yè)面中僅能被使用一次。有可能在很大部分瀏覽器中反復(fù)使用同一個(gè)ID不會(huì)出現(xiàn)問(wèn)題，但在標(biāo)準(zhǔn)上這絕對(duì)是錯(cuò)誤的使用，而且很可能導(dǎo)致某些瀏覽器的現(xiàn)實(shí)問(wèn)題。（剛才在Dreamweaver中試了一下，確實(shí)，并沒(méi)有出錯(cuò)）
在實(shí)際應(yīng)用的時(shí)候，Class可能對(duì)文字的排版等比較有用，而ID則對(duì)宏觀布局和設(shè)計(jì)放置各種元素較有用。
至于ID，通常用于定義頁(yè)面上一個(gè)僅出現(xiàn)一次的標(biāo)記。在對(duì)頁(yè)面排版進(jìn)行結(jié)構(gòu)化布局時(shí)（比如說(shuō)通常一個(gè)頁(yè)面都是由一個(gè)頁(yè)眉，一個(gè)報(bào)頭<masthead>，一個(gè)內(nèi)容區(qū)域和一個(gè)頁(yè)腳等組成），一般使用ID比較理想，因?yàn)橐粋€(gè)ID在一個(gè)文檔中只能被使用一次。而這些元素在同一頁(yè)面中很少會(huì)出現(xiàn)大于一次的情況。
歸納成一句話就是：Class可以反復(fù)使用而ID在一個(gè)頁(yè)面中僅能被使用一次。有可能在很大部分瀏覽器中反復(fù)使用同一個(gè)ID不會(huì)出現(xiàn)問(wèn)題，但在標(biāo)準(zhǔn)上這絕對(duì)是錯(cuò)誤的使用，而且很可能導(dǎo)致某些瀏覽器的現(xiàn)實(shí)問(wèn)題。（剛才在Dreamweaver中試了一下，確實(shí)，并沒(méi)有出錯(cuò)）
在實(shí)際應(yīng)用的時(shí)候，Class可能對(duì)文字的排版等比較有用，而ID則對(duì)宏觀布局和設(shè)計(jì)放置各種元素較有用。
相關(guān)文章
使用display:none時(shí)隱藏DOM元素?zé)o法獲取實(shí)際寬高的解決方法
這篇文章主要介紹了使用display:none時(shí)隱藏DOM元素?zé)o法獲取實(shí)際寬高的解決方法的相關(guān)資料,需要的朋友可以參考下2022-07-07
使用CSS框架布局的缺點(diǎn)和優(yōu)點(diǎn)小結(jié)
本篇文章主要介紹了使用CSS框架布局的缺點(diǎn)和優(yōu)點(diǎn)小結(jié)，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2007-12-12
看好的站長(zhǎng)都是很愛(ài)國(guó)的，捐款，網(wǎng)頁(yè)統(tǒng)一成黑白色2008-05-05
css 兼容性問(wèn)題this.style.cursor=''''hand''''
css 兼容性問(wèn)題this.style.cursor='hand'讓我們來(lái)CSS HACK2008-11-11
htm頁(yè)面中<a name>加name和id的沖突附解決方法
原來(lái)在<a name="jb51"> 和<span id="jb51">是沖突的，唉弄了好一會(huì)，郁悶 臨時(shí)解決方法就是在后面的id中加了一個(gè)2，就是<span id="jb512">2008-07-07
在CSS網(wǎng)頁(yè)布局開(kāi)發(fā)中，會(huì)有很多小技巧，新手朋友往往對(duì)此很不熟悉。在某一兩個(gè)小問(wèn)題上，或許糾纏很長(zhǎng)時(shí)間才能搞明白，2008-08-08
div的dispaly:inline樣式 和span的區(qū)別
為什么在ie里執(zhí)行后這段代碼 兩個(gè)span標(biāo)簽雖在同一行但它們之間有空隙? 但是 兩個(gè)div標(biāo)簽雖然在同一行就沒(méi)有空隙?2008-07-07
web打印的另類方法...2007-03-03
Web的發(fā)展非常迅速，UI設(shè)計(jì)也越來(lái)越美觀，漂亮。同時(shí)也給WEB前端編碼提出了新的要求。鏈接元素在點(diǎn)擊時(shí)會(huì)出現(xiàn)虛線框，由于種種原因，您的主管可能要求你想辦法將鏈接虛線邊框出除。2008-05-05
繼承是 css中經(jīng)常要用到的技術(shù)，好處是可以盡量讓頁(yè)面的代碼減少重復(fù)利用，但是隨時(shí)項(xiàng)目越來(lái)越大，需求的不斷變化，css代碼就會(huì)變得越來(lái)越臃腫，后期難以控制和維護(hù)。其實(shí)，css代碼和普通程序代碼在編寫(xiě)的時(shí)候有很多的相似之處，下面我們就用試試用組合的方式是不是能更好的解決這個(gè)問(wèn)題。2008-11-11