CSS選擇器簡介

2022-08-21 02:36:13 字數 1018 閱讀 6897

1、常用的css選擇器

選擇器名稱(

8種)示例

注意1、

html

選擇器日照香爐生紫煙,遙看瀑布掛前川。p2

、類選擇器

class

class="txt"/>

.txt以.

開頭3、id

選擇器id="day9">

九天#day9

id唯一

4、群組聯合選擇器

h1,h3,p,h4以,

分隔5、上下文選擇器

16table tr #age16

table tr #age

之間以空格隔開

6、偽元素選擇器

#holiday:first-letter以:

分隔7、偽類選擇器

這是乙個假鏈結

#mya:link以:

分隔8、萬用字元選擇器**

2、css

**位置(3個)

1

)style

標記在head

標記中引入:

2)內聯樣式:

3)外部樣式檔案:

3、選擇器優先順序

偽元素選擇器 > 內聯樣式 > id選擇器 > 偽類選擇器 > 類選擇器 > 上下文選擇器 > html選擇器 > 萬用字元選擇器

群組選擇器不能做比較,因為群組選擇器實際上是一種簡寫

CSS 選擇器簡介

前言 這是筆者學習之後自己的理解與整理。如果有錯誤或者疑問的地方,請大家指正,我會持續更新!如果以4位數表示選擇符權重,那麼 css選擇器簡介 部分屬性選擇器 div class a 獲取 class 屬性值以 a 為開頭的 div 元素 div class b 獲取 class 屬性值以 b 為結...

css 選擇器簡介

前言 這是筆者學習之後自己的理解與整理。如果有錯誤或者疑問的地方,請大家指正,我會持續更新!如果以4位數表示選擇符權重,那麼 部分屬性選擇器 div class a 獲取 class 屬性值以 a 為開頭的 div 元素 div class b 獲取 class 屬性值以 b 為結尾的 div 元素...

CSS的簡介及其選擇器

基本語法檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視文字內容 檢視css的效果 檢視css的效果 檢視css的效果 zhangsan 23 選擇所有標籤1.未連線 a link 2.已經訪問鏈結 a visited...