CSS 選擇器 1 基本

2021-10-02 15:07:07 字數 2903 閱讀 4815

1. 元素選擇器 elementname(元素名稱)

2. 類選擇器 .classname(類名)

3. id選擇器 #idname(id名)

4. 通配選擇器 *號(效能低,慎用)

5. 屬性選擇器 [屬性=值]

1. [[*attribute*\]]( 匹配attribute的元素

2. [[*attribute*=*value*\]]( 選擇匹配attribute=value的元素

3. [[*attribute*~=*value*\]]( 選擇 attribute 屬性包含單詞 value 的元素(必須是單個詞語)

4. [[*attribute*|=*value*\]]( 選擇attribute 屬性值以 value 開頭的元素(必須是單個詞語)

5. [[*attribute*^=*value*\]]( 選擇 attribute 屬性以value開頭的元素

6. [[*attribute*$=*value*\]]( 選擇 attribute 屬性以value結尾的元素

7. [[*attribute**=*value*\]]( 選擇 attribute 屬性以包含字串value的元素

css**

包含塊測試title

>

rel=

"stylesheet"

href

="css/style.css"

>

head

>

>

>

>

>

元素選擇器section

>

li>

>

class

="cls"

>

類選擇器div

>

li>

>

"el"

>

id選擇器div

>

li>

>

class

="global"

>

通配選擇器div

>

li>

>

>

屬性選擇器:div

>

>

>

1. [attribute]dt

>

title

>

匹配attribute的元素dd

>

>

2. [attribute=value]dt

>

title

="title"

>

選擇匹配attribute=value的元素dd

>

>

3. [attribute~=value]dt

>

title

="word os"

>

選擇 attribute 屬性包含單詞 value 的元素(必須是單個詞語)dd

>

>

4. [attribute|=value]dt

>

title

="first-a"

>

選擇attribute 屬性值以 value 開頭的元素(必須是單個詞語)dd

>

>

5. [attribute^=value]dt

>

title

="first-aw"

>

選擇 attribute 屬性以value開頭的元素dd

>

>

6. [attribute$=value]dt

>

title

="first-as"

>

選擇 attribute 屬性以value結尾的元素dd

>

>

7. [attribute*=value]dt

>

title

="first-a contain"

>

選擇 attribute 屬性以包含字串value的元素dd

>

dl>

li>

ol>

body

>

html

>

1. 相鄰兄弟選擇器 a + b (選擇a相鄰的乙個b)

2. 普通兄弟選擇器 a ~ b (選擇a同級後面的所有b)

3. 子選擇器 a > b (選擇a所有的子代b)

4. 後代選擇器 a b (選擇a下的所有b)

CSS 基本選擇器

css的選擇器 告訴css的 作用在哪個標籤上。基本選擇器 標籤名選擇器 div span 類選擇器 在html的標籤上,提供了屬性 class,定位到div的標籤 美工經常使用的方式 寫法 class的名稱 hehe 設定不同的標籤,具有相同的樣式 id選擇器 在html的標籤上,提供的屬性 設定...

基本CSS選擇器

基本css選擇器,復合選擇器,後代選擇器 基本css選擇器有標記選擇器 類別選擇器 id選擇器3種 1。標記選擇器 每一種html標記的名稱都可以作為相應的標記選擇器的名稱,如h1,p,等等 2。類別選擇器 類別選擇器的名稱可以由使用者自定義 格式如下 class 3。id選擇器 與類別選擇器相試 ...

CSS基本選擇器

作用 選擇介面上的某乙個或者某一類元素 標籤選擇器會選擇到頁面上所有的這個標籤的元素 h1 h1為標籤 選擇所有class屬性一致的標籤,跨標籤 同乙個標籤,但是顏色不同,則不能用標籤選擇器。在標籤內定義class,並在style中分別用類選擇器定義顏色 好處 可以多個標籤歸類,是同乙個class,...