CSS選擇器,繼承,層疊,權重

2021-07-24 07:34:14 字數 820 閱讀 5385

這節主要講css選擇器:

最常用的有兩種選擇器:1 型別選擇器(也稱為元素選擇器) p

2 後代選擇器 (兩者之間加空格).first span

通用選擇器:萬用字元 *

css3選擇器:

子選擇器:

相鄰同袍選擇器:

屬性選擇器:

偽類:love                    hate

link  visited       hover  active

css的重疊與特殊性:

當乙個元素有很多條規則時,css其實是通過層疊來解決各個規則之間的衝突。(通過給規則增加  ! important 便可以讓它優先)   層疊解決的問題是乙個標籤有多個規則,瀏覽器最後選擇什麼樣式呈現。

而繼承則講的是乙個標籤會用它父元素的樣式,因而改變自身樣式。但是自身樣式受層疊影響

內聯樣式 例如: style=""值最高 (1000 點)

4 `, l% l) r1 f! e7 v! \

各個id屬性值 例如:id="header"(100 點)

屬性值,屬性選擇或偽類 例如:class="left" ( 10 點)

各個元素和偽元素 例如 li ul p a (1點)

# f1 e- @9 x3 n: s9 m7 [ h$ b$ h* l9 a

結合符合通配選擇器 例如* ( 0點)

舉個栗子:

#content div#main-content h2     100+1+100+1=202

#content #main-content>h2     100+100+1=201

css層疊的含義及css選擇器權重

一 層疊指的是樣式的優先順序,當產生衝突時以優先順序高的為準 1.內聯樣式 內部樣式 外部樣式 如果出現important標記,則important的優先順序最高 2.id選擇器 類選擇器 元素選擇器 3.權重相同時取後定義的樣式二 css選擇器權重 當兩個選擇器給同乙個元素設定相同樣式時,會優先使...

css選擇器 權重

基礎選擇器 一 標籤選擇器 p h1 css不區分大小寫,建議小寫 1 所有的標籤都可以作為標籤選擇器去使用 2 無論這個標籤藏多深,一定能夠被選上 3 選擇頁面所有的,而不是具體某乙個 標籤選擇器,選擇的是頁面上所有這種型別的標籤,所以經常描述 共性 無法描述某乙個元素的 個性 的。二 id選擇器...

css選擇器 繼承,優先順序,層疊

繼承 即子類元素繼承父類的樣式 優先順序 是指不同類別樣式的權重比較 層疊 是說當數量相同時,通過層疊 後者覆蓋前者 的樣式。首先來看一下css選擇符 css選擇器 有哪些?1.標籤選擇器 如 body,div,p,ul,li 2.類選擇器 如 class head class head logo ...