西西軟件園多重安全檢測下載網(wǎng)站、值得信賴的軟件下載站!
軟件
軟件
文章
搜索

首頁西西教程DreamWeaver → 網(wǎng)頁設(shè)計CSS樣式中id 和class使用哪個好?

網(wǎng)頁設(shè)計CSS樣式中id 和class使用哪個好?

相關(guān)軟件相關(guān)文章發(fā)表評論 來源:西西整理時間:2013/7/20 18:06:15字體大。A-A+

作者:西西點擊:302次評論:0次標簽: CSS樣式

CSS樣式圖片下載助手1.2.11.5 綠色免費版
  • 類型:下載工具大小:459KB語言:中文 評分:3.3
  • 標簽:
立即下載

定義css引用時用class還是ID好?當定義一個屬性時,是使用id,還是使用class?

我們平常在用DIV CSS制作Xhtml網(wǎng)頁頁面時,常會用到class 和id來選擇調(diào)用CSS樣式屬性。對學習CSS的新手來說class和id可能比較模糊,同時不知道什么時候該用class,什么時候又用id,以及它們用法與限制是怎么樣的。接下來我們就來詳細了解CLASS與ID基本屬性及用法。

DIV CSS中id與class使用原則

id的使用原則:

先來說說id,id具有唯一性,其使用原則也是依據(jù)這一特性建立的。id是不能重復的,所以在XHTML的結(jié)構(gòu)中,大結(jié)構(gòu)一定是用id。比如標志、導航、主體內(nèi)容、版權(quán)。這些根據(jù)制定的規(guī)范命名為#logo,#nav,#content,#copyright等等,本著其唯一性的原則園子建議定義id盡量在外圍使用。

ID是表示著標簽的身份,在JS腳本中會用到id,當JS要修改一個標簽的屬性時,JS會將id名作為該標簽的唯一標識進行操作。也就是說ID只是頁面元素的標識,供其他元素腳本等引用。假如你的頁面里出現(xiàn)了兩個ID那JS效果特性較出現(xiàn)邏輯錯誤不知道依據(jù)哪個ID來改變其標簽屬性。

 在CSS里的ID不一定為JS而設(shè)置的,但是同樣ID在頁面里也只能出現(xiàn)一次,并且是唯一性。雖然可能我們才學DIV+CSS愛好者在一個頁面里同時調(diào)用相同的ID多次但是仍然沒有出現(xiàn)頁面混亂錯誤,但是我們?yōu)榱薟3C及各個標準我們也要遵循ID在一個頁面里唯一性。以免出現(xiàn)瀏覽器兼容問題。

class的使用原則:

class在CSS的定義中具有普遍性。說白一點就是class具有可重復無限制的使用多次,園子建議大家盡量在結(jié)構(gòu)內(nèi)部使用。這樣做的好處是有利于網(wǎng)站代碼的后期維護與修改,這樣的做法就會讓所有的class都成為id的子級或是孫級。在我們寫CSS的時候可以寫成這樣#father.child{…},另外需要注意的是盡量不要讓class包含id,比如.father#child{…}如果寫成這樣很顯然就非常不可取。當然這也只是相對于良好書寫習慣的一些建議,僅供大家參考。

Class 在程序中稱“類”,同時在CSS中也書面語也叫“類”。在CSS樣式中以小寫的“點”及“.”來命名如: .css5{屬性:屬性值;} ,而在html頁面里則以class="css5" 來選擇調(diào)用,命名好的CSS又叫css選擇器。如: .css5{屬性:屬性值;} 選擇器在html調(diào)用為“<div class="css5">我是class例子</div> ”如果不知道怎么引用CSS,那就可以了解下css引用。

而且class(類)在同一個html網(wǎng)頁頁面可以無數(shù)次的調(diào)用相同的class類,在這里例子里則可以在對應的網(wǎng)頁里可以無數(shù)次調(diào)用選擇“css5”。這也說明class一般是用來調(diào)用css中的預配制屬性的,比如說有一個預配制屬性為如這里的“.class01{屬性:屬性值;} ”,這樣就可以像調(diào)用函數(shù)一樣不用再一個網(wǎng)頁頁面里重復的配置一個“類”屬性,而只需要寫上一個class類選擇,就可以在同一個頁面里任何位置調(diào)用選擇具有相同的CLASS類。

Div css 頁面中的ID是怎么個用法呢?

通常我們在CSS樣式定義的時候 以“#”來開頭命名id名稱如:#css5{屬性:屬性值;} 這個也有點像class的定義,只是class是以小寫句號“.”開頭命名,而ID是以“#”好開頭定義。那id是怎么個用法呢? Css里的ID用法與class用法一樣,只是把class換成id。如例子:在CSS樣式定義ID --- #css5{height:25px;width: 200px;} ,調(diào)用ID --- <div id="css5">我是ID例子</div>。

其實兩種方法的效果是一樣的,但是id只能給一個元素指明類樣式,而class可以在任一元素中定義它的樣式。

特別注意:在命名id和class類的時候特別要注意大小寫,ID和class是對大小寫非常敏感的,最好以英文開頭,不要用中文命名CSS類名。

歸總起來一句話:id是唯一的并且是父級的,class是可以重復的并且是子級的。保持一個良好的代碼書寫習慣對于以后的代碼維護會有很大的幫助

    相關(guān)評論

    閱讀本文后您有什么感想? 已有人給出評價!

    • 8 喜歡喜歡
    • 3 頂
    • 1 難過難過
    • 5 囧
    • 3 圍觀圍觀
    • 2 無聊無聊

    熱門評論

    最新評論

    發(fā)表評論 查看所有評論(0)

    昵稱:
    表情: 高興 可 汗 我不要 害羞 好 下下下 送花 屎 親親
    字數(shù): 0/500 (您的評論需要經(jīng)過審核才能顯示)