CSS樣式 選擇器

2021-10-23 01:32:28 字數 1436 閱讀 1978

css的選擇器

（1）標籤選擇器：div、p、a、input、span、h1……

div
p
我是段落
（2）類選擇器：class

/類選擇器樣式：class/

.stylediv
我是div容器


我是div中的段落
（3）id選擇器：id

/id選擇器樣式：id/

#stylep
我是div容器
（4）並列選擇器：

/並列選擇器樣式：類&id/

#main, .test1
（5）復合選擇器：

/復合選擇器樣式：標籤中的類/

div.stylediv
我是div容器


我是div中的段落
（6）後代選擇器：

/後代選擇器樣式：標籤中的標籤，或類中的類，或id中的id/

div p
我是div容器


我是段落標籤
（7）直接後代選擇器：

div > p
我是div容器


我是段落標籤


我是span容器


我是span中的段落
（8）相鄰兄弟選擇器：

/相鄰兄弟選擇器：兩個相鄰標籤的後面標籤的style/

h3 + a
a + h3
我是超連結1
我是超連結2
（9）屬性選擇器：

h4[name][age]


h4[name="devzhang"]


我是標題4-1


我是標題4-2


我是標題4-3
（10）偽類選擇器：

input:focus


input:active


p:hover
（11）偽元素選擇器：

p[job="iosdev"]:first-letter


我是段落：偽元素

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 樣式規則選擇器

主要有三種 html選擇器 class選擇器 id選擇器 1.html選擇器 1 2 3 type text css 4 p 8 style 9 head 10 11 12 p 這裡應用樣式表 p 13 body 14 html 也就是說選擇器是html標籤 2.class選擇器 1 2 head ...