7 CSS的Class以及ID選擇器

2021-08-29 19:23:37 字數 2076 閱讀 6782

前面的學習我們僅僅使用html選擇器(在html頁面裡為html標籤,如 p)

現在我們學習使用clss和id定義屬於自己的選擇器。

這樣,同樣的html元素可以通過class或id使用不同的表現。

在css裡,使用點號(.)建立class選擇器,使用hash符號(#)建立id選擇器。

例子:

#top

.intro

html頁面通過id和class屬性呼叫css,像下面這樣:

this is my recipe for ****** curry purely with chocolate

mmm mm mmmmm

id和class的不同指出在於乙個頁面同乙個id只能只有一次,而class可以無限制使用。

同樣,你可以在html選擇器後面使用乙個選擇器來指定特殊html元素,比如p.jam將作用到帶有'jam'class屬性的段落。

[b]css selector: class 與 id 的區別[/b]

css selector:class 和 id 都可以使「單一選擇符」有不同的樣式

a1:二者主要的區別在**呢?

id你只能用來定義單一元素,定義二個以後。頁面不會出現什麼問題,但是w3檢測的時候認為你頁面不符合標準;class是類,同乙個class可以定義多個元素。就頁面效果而言,兩個東西的視覺效果幾乎無差別。

a2:id 選擇符為什麼要少用,它有有什麼侷限性?

單一使用的樣式用id,需要程式、js動態控制的樣式用id,id在頁面只能使用一次!提供少用id,因為id可能和頁面嵌的程式衝突(比如名稱相同等)!

a3:我該在什麼時候使用id,什麼時候使用class?

單一的元素,或需要程式、js控制的東西,需要用id定義;重複使用的元素、類別,用class定義。

[b]結構中id與class的使用原則與技巧[/b] 

id與class的使用原則

以上就是id與class使用原則,歸總起來一句話:id是唯一的並是父級的,class是可以重複的並是子級的。

id與class的使用技巧

1、子級的命名的包含父命名中的部分為開頭。這樣方便在編寫css時明確層次關係。

2、class中的子級最好不用id。當然特殊情況特殊對待。

3、class的命名最好命名用大小寫合用。例 .newmovie 這樣的寫法與第一條結合起來使用明確關係最合適。要需要注意的是ie以外的瀏覽器對於大小寫是很敏感的。還有就是一定要以字母開頭。

其實上面講的都是一些大家都明白的內容,只是我撿了個漏先寫下來算是乙個總結。希望大家對於id與class的使用提出自己的新觀點新思路。一起總結出最適合也最有效率的規範來。

[b]id與class區別 - 該用id還是用class呢[/b]

id與class區別,我在前面的文章中已經講過了。但還是有新手對此非常迷茫,不知道什麼時候該用id,什麼時候該用class。這兩個選擇器讓新手左右為難。

一、在web標準中是不容許重複id的,例如 div id="a" 不容許重複2次;而class所定義的是類,理論上可以無限重複。以根據需要多次引用。

二、屬性的優先順序問題:id 的優先順序要高於class,我們在下面的**中有示例說明。

三、方便js等客戶端指令碼的引用,如果在頁面中要對某個物件進行指令碼操作,那麼可以給他定義乙個id,否則只能利用遍歷頁面元素加上指定特定屬性來找到它,這是相對浪費時間資源,遠遠不如乙個id來得簡單與快捷。

id與class優先順序的試驗

52css.com - div+css xhtml xml 教程大全

52css.com - div+css xhtml xml 教程大全

解析:根據一般的css優先順序的原則。接近的應該是優先的。class="yourhomepage"更接近於定義樣式的元素。但此例中,對元素應用的樣式是id所定義的樣式。說明id的優先順序要高於class!

[b]同一元素應用多個class的優先順序的測試[/b][url]

CSS教程8 CSS的Class以及ID選擇器

前面的學習我們僅僅使用html選擇器 在html頁面裡為html標籤,如 p 現在我們學習使用clss和id定義屬於自己的選擇器。這樣,同樣的html元素可以通過class或id使用不同的表現。在css裡,使用點號 建立class選擇器,使用hash符號 建立id選擇器。例子 example sou...

CSS中id和class的區別

首先,在表現形式上 id 的優先順序比css高,例如 藍色理想 id和class都定義了背景顏色的屬性,但是由於id的優先順序比class高,所以背景色為id所定義的紅色 再次,class是通用屬性,就是說幾個div可以呼叫同乙個class 而id是唯一的,web標準中不允許出現兩個div的id標識...

CSS中class和id的區別

類選擇器和id選擇器是css中經常使用到的選擇器,看書看一遍的時候就如囫圇吞棗,一掃而過,所以理解得也不透徹。今天又重新看到了,腦海裡的概念總算清晰了點。所以總結了一下他們之間的區別,列出如下 1.所繫結的標籤屬性不同,class選擇器繫結的標籤屬性為class,例如下面的例子 123 1112 我...