Css選擇器的種類

2021-09-26 21:00:26 字數 1141 閱讀 1062

選擇器有 全域性選擇器,組合選擇器,後代選擇器,子元素選擇器,巢狀選擇器,標籤選擇器,類選擇器,id選擇器,偽類選擇器這幾種。

全域性選擇器:設定所有標籤使用同一樣式,用表示

全域性選擇器語法:{}

全域性選擇器:設定所有標籤使用同一樣式,用表示

全域性選擇器語法:{}

顯示效果:

html**:

我是段落紅色

css**: * !結構和樣式分離:分工明確,操作簡單 組合選擇器: h1,h2,h3,h4,h5,p h.special,special,#one 後代選擇器: yy

yy塊內容2

塊內容1

4.id選擇器 權重 100 行內樣式 權重 1000 id選擇器和類選擇器類似,但要注意同一id名在同乙個頁面中只能出現一次。(具有唯一性) id選擇器的語法: #id名{} 顯示效果: 執行步驟 在網頁中書寫css**: 【e】#con 給h1標記新增id選擇器con。

我是段落紅色

我是段落紅色

我是段落紅色

5.偽類選擇器 a:link(未被訪問過,訪問之前的狀態) a:hover (滑鼠滑過) a:hover; 滑鼠放上去後有下劃線 a:active(滑鼠按下) a:visited(訪問過後) 偽類選擇器: 用偽類定義的樣式並不是作用在標記上,而是作用在標記的狀態上。 我們這裡只要求掌握超連結的偽類a:hover。 偽類選擇器的語法: a:hover a:active a:visited

顯示效果:

執行步驟

html**

公司首頁

公司新聞

產品展示

練習我們

css**:

a a:hover

優先順序:id>class>標籤》全域性

權重值:

style 1000

id 100

class 10

標籤(p)1

全域性(*)0

(標籤選擇器的一種)派生選擇器(包含選擇器):html div {} p a{}

偽類選擇器主要是超連結的偽類a:hover

a:link(未被訪問過,訪問之前的狀態)

a:hover (滑鼠滑過) a:hover; 滑鼠放上去後有下劃線

a:active(滑鼠按下)

a:visited(訪問過後)

css選擇器種類介紹

1.標籤選擇器 用標籤名作為選擇器,就是指給同名的標籤統一加上外觀樣式,這種選擇器影響範圍大,一般用來做一些通用設定,或者層級選擇器中 例 div 這是第乙個div 這是第二個div 2.類選擇器 1.可使用class的屬性,把html網頁中的標籤進行分類,然後根據類名稱來進行設定 2.注意 1.使...

css中選擇器種類總結

b 1 型別選擇器 即html標籤選擇器 b 選擇器名稱 屬性 屬性值 如 h2 color white color red 關注點 不需要 號,不需要 號,就是 html標籤名稱 屬性 屬性值 color b 2 屬性選擇器 html標籤中的屬性選擇器,比如div 有align屬性 b 選擇器名稱...

css選擇器 CSS選擇器總結

在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...