技巧總結(jié):div中class與id的區(qū)別及應(yīng)用_Web標(biāo)準(zhǔn)教程
class是設(shè)置標(biāo)簽的類。
id是設(shè)置標(biāo)簽的標(biāo)識。
class屬性用于指定元素屬于何種樣式的類。
如樣式表可以加入:
.baobao { color: lime; background: #ff80c0 }
使用方法:class="baobao"
id屬性用于定義一個(gè)元素的獨(dú)特的樣式。如一個(gè)CSS規(guī)則:
#binbin { font-size: larger }
使用方法:id="binbin"
id是一個(gè)標(biāo)簽,用于區(qū)分不同的結(jié)構(gòu)和內(nèi)容,就象你的名字,假如一個(gè)屋子有2個(gè)人同名,就會(huì)出現(xiàn)混淆;
class是一個(gè)樣式,可以套在任何結(jié)構(gòu)和內(nèi)容上,就象一件衣服;
概念上說就是不一樣的:id是先找到結(jié)構(gòu)/內(nèi)容,再給它定義樣式;class是先定義好一種樣式,再套給多個(gè)結(jié)構(gòu)/內(nèi)容。
一個(gè)Class是用來根據(jù)用戶定義的標(biāo)準(zhǔn)對一個(gè)或多個(gè)元素進(jìn)行定義的。打個(gè)比較恰當(dāng)?shù)谋确骄褪莿”荆阂粋(gè)Class可以定義劇本中每個(gè)人物的故事 線,你可以通過CSS,javascript等來使用這個(gè)類。因此你可以在一個(gè)頁面上使用class="Frodo" ,class= "Gandalf", class="Aragorn"來區(qū)分不同的故事線。還有一點(diǎn)非常重要的是你可以在一個(gè)文檔中使用任意次數(shù)的Class。
至于 ID,通常用于定義頁面上一個(gè)僅出現(xiàn)一次的標(biāo)記。在對頁面排版進(jìn)行結(jié)構(gòu)化布局時(shí)(比如說通常一個(gè)頁面都是由一個(gè)頁眉,一個(gè)報(bào)頭< masthead>,一個(gè)內(nèi)容區(qū)域和一個(gè)頁腳等組成),一般使用ID比較理想,因?yàn)橐粋(gè)ID在一個(gè)文檔中只能被使用一次。而這些元素在同一頁面中 很少會(huì)出現(xiàn)大于一次的情況。
歸納成一句話就是:Class可以反復(fù)使用而ID在一個(gè)頁面中僅能被使用一次。有可能在很大部分瀏覽器中反復(fù)使用同一個(gè)ID不會(huì)出現(xiàn)問題,但在標(biāo)準(zhǔn)上這絕對是錯(cuò)誤的使用,而且很可能導(dǎo)致某些瀏覽器的現(xiàn)實(shí)問題。
在實(shí)際應(yīng)用的時(shí)候,Class可能對文字的排版等比較有用,而ID則對宏觀布局和設(shè)計(jì)放置各種元素較有用。
- Web標(biāo)準(zhǔn):需要正確的使用H1~ H6標(biāo)簽
- 五個(gè)WEB標(biāo)準(zhǔn)中必須注意的地方
- 做到結(jié)構(gòu)(XHTML),表現(xiàn)(CSS),行為(JavaScript)的分離
- CSS標(biāo)準(zhǔn):HTML標(biāo)簽元素的關(guān)閉
- Web標(biāo)準(zhǔn)之路 勿使用W3C廢棄的元素
- CSS布局 聲明文檔類型描述(DTD)
- DIV CSS\讓搜索引擎蜘蛛不再累
- 用XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)頁
- XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)站
- DIV+CSS對SEO的幫助
- 淺析什么是Web標(biāo)準(zhǔn) 及其前景
- CSSer新手寄語:開始標(biāo)準(zhǔn)之路
Web標(biāo)準(zhǔn)教程Rss訂閱Div+Css教程搜索
Web標(biāo)準(zhǔn)教程推薦
- 利用插件來校驗(yàn)XHTML是否符合Web標(biāo)準(zhǔn)
- 高性能表現(xiàn)的div css網(wǎng)站
- WEB標(biāo)準(zhǔn)教程第9天:第一個(gè)CSS布局實(shí)例
- WEB標(biāo)準(zhǔn)教程第4天:調(diào)用樣式表
- Web標(biāo)準(zhǔn)化制作:利用CSS按比例縮小圖片
- WEB2.0標(biāo)準(zhǔn)教程:第四天 調(diào)用樣式表
- WEB2.0標(biāo)準(zhǔn)教程:第一天 選擇什么樣的DOCTYPE
- WEB2.0標(biāo)準(zhǔn)教程:第七天 CSS入門
- AboutWebDesign
- CSS樣式表規(guī)劃與管理的經(jīng)驗(yàn)總結(jié)
- 相關(guān)鏈接:
- 教程說明:
Web標(biāo)準(zhǔn)教程-技巧總結(jié):div中class與id的區(qū)別及應(yīng)用
。