CSS樣式選擇器的使用(一)

2021-09-25 06:24:55 字數 1019 閱讀 8638

常用的選擇器

css選擇器作用:就是指定css要作用的標籤,那個標籤的名稱就是選擇器。意為:選擇哪個容器。

分類:基本選擇器和擴充套件選擇器。

基本選擇器:

這個是前端開發中的標籤選擇器

2id選擇器:規定用#來定義

針對某乙個特定的標籤來使用,只能使用一次。css中的id選擇器以」#」來定義。

這是id選擇器

id選擇器的命名規則:

(1)只能有字母、數字、下劃線。

(2)必須以字母開頭。

(3)不能和標籤同名。比如id不能叫做body、img、a。

(4)大小寫嚴格區分,也就是說aa,和aa是兩個不同的id

另外,特別強調的是:html頁面,不能出現相同的id,哪怕他們不是乙個型別。比如頁面上有乙個id為pp的p,乙個id為pp的div,是非法的!

3類選擇器:規定用圓點.來定義

和id非常相似,任何的標籤都可以攜帶id屬性和class屬性。但是id屬性只能被某一特定標籤引用一次

class屬性的特點:

特性1:類選擇器可以被多種標籤使用。

特性2:同乙個標籤可以使用多個類選擇器。用空格隔開。舉例如下

應該注意:

(1)不要去試圖用乙個類名,把某個標籤的所有樣式寫完。這個標籤要多攜帶幾個類,共同完成這個標籤的樣式。

(2)每乙個類要盡可能小,有「公共」的概念,能夠讓更多的標籤使用。

如:

我是乙個p

4萬用字元選擇器

將匹配任何標籤。不建議使用,ie有些版本不支援,大**增加客戶端負擔。

效率不高,如果頁面上的標籤越多,效率越低,所以頁面上不能出現這個選擇器。

舉例:

CSS樣式選擇器

1.css 選擇器 1 標記選擇器 選擇器 用來指定確定標記的樣式 如 類別選擇器 class 類別名稱 如 對應的 class 選擇器 id選擇器 id id選擇器 如 對應的 id選擇器1id 選擇器2 2.集體宣告 對應的 集體宣告 h4集體宣告 h5集體宣告 p1集體宣告 p2集體宣告 p3...

CSS樣式選擇器

樣式選擇器 每一條css樣式宣告 定義 由兩部分組成,形式如下 選擇器類選擇器 以英文圓點開頭,不可以使用數字或中文起名 使用方法 1.使用class 類選擇器名 為標籤設定乙個類,如下 膽小如鼠 2.設定類選擇器css樣式,如下 stress id選擇器 id選擇器類似於類選擇器 1.為標籤設定i...

CSS樣式 選擇器

css的選擇器 1 標籤選擇器 div p a input span h1 divp我是段落 2 類選擇器 class 類選擇器樣式 class stylediv我是div容器 我是div中的段落 3 id選擇器 id id選擇器樣式 id stylep我是div容器 4 並列選擇器 並列選擇器樣式...