摘要:樣式優先級原則總的原則規定擁有更高確定度的選擇器優先級更高如果樣式中包含沖突的規則,且它們具有相同的確定度。
樣式優先級原則
總的原則
1.CSS規定擁有更高確定度的選擇器優先級更高
2.如果樣式中包含沖突的規則,且它們具有相同的確定度。那么,后出現的規則優先級高。
優先級:由高到低(從上到下)
!important
內聯(1,0,0,0)
id: (0,1,0,0)
類:(0,0,1,0)
偽類/屬性
元素:(0,0,0,1)
通配符
類選擇器class="web",多個元素可以擁有同一個類名
id選擇器id="web",具有唯一性
偽類選擇器CSS偽類(pseudo-class)是加在選擇器后面的用來指定元素狀態的關鍵字。
鏈接相關a:link 未訪問的鏈接
a:visited 已訪問的鏈接
a:hover 鼠標移動到鏈接上
a:active 選定的鏈接
:target 可用于選取當前活動的目標元素,href="#222"(內容跳轉)
:focus 偽類在元素獲得焦點時向元素添加特殊的樣式
:disabled 匹配每個被禁用的元素(大多用在表單元素上)。
:enabled 表示任何啟用的(enabled)元素
:checked 匹配每個已被選中的 input 元素(只用于單選按鈕和復選框)(只有opera支持)
:empty 代表沒有子元素的元素,只計算元素結點及文本(包括空格),注釋、運行指令不考慮在內。
:first-child 代表了某個元素,這個元素是它父元素的的第一個子元素
:first-of-type
:last-of-type
:nth-clild(n) 選擇器匹配屬于其父元素的第 N 個子元素,不論元素的類型
n 可以是數字、關鍵詞或公式(2,an + b,odd)(n 是計數器(從 0 開始),b 是偏移值)
:nth-last-child(n)倒數
:nth-of-type(n)
E[attr]
E[attr=value]
E[attr~=value] 選擇器用于選取屬性值中包含指定詞匯的元素
E[attr^=value] 選擇器匹配屬性值以指定值開頭的每個元素。
E[attr*=value]
E[attr$=value]
A E 任何是元素A的后代元素E (后代節點指A的子節點,子節點的子節點,以此類推)
A > E 任何元素A的子元素(直接)
B + E 任何元素B的下一個兄弟元素E(直接)
B ~ E B元素后面的擁有共同父元素的兄弟元素E
.class1.class2 同時包含class1和class2屬性的元素
F#id 具有某id的F元素
E,F 所有E或F元素
偽元素E:first-line 向文本的首行添加特殊樣式。
E:first-letter 向文本的第一個字母添加特殊樣式。
E:before 在元素之前添加內容。
E:after 在元素之后添加內容。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/111144.html
摘要:內聯樣式標簽魚頭注根據張鑫旭老師在有趣個選擇器可以干掉個選擇器分享過個級聯選擇器可以擊敗個選擇器目前已無此現象。 作者:陳大魚頭 github: KRISACHAN 在上一篇的HTML的標簽與語意中簡單的介紹了HTML標簽跟其一些屬性,向各位堅持看到這里的親表示真誠的感謝。本篇主要會分享一些跟CSS選擇器(CSS Selectors)相關的內容,有興趣的請繼續往下看。 CSS選擇...
摘要:不要在編寫規則時用標簽名或類名不要在編寫規則時用標簽名把多層標簽選擇規則用規則替換,減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關心頁面性能的話,他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優先級 一、CSS選擇符 CSS選擇符由一些初始化參數組成,這些參數指明了要應用這個CSS規則的頁面元素。 作為一個網站的前端開發工程師,應該避免編寫一些常見的開銷很大的CS...
摘要:不要在編寫規則時用標簽名或類名不要在編寫規則時用標簽名把多層標簽選擇規則用規則替換,減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關心頁面性能的話,他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優先級 一、CSS選擇符 CSS選擇符由一些初始化參數組成,這些參數指明了要應用這個CSS規則的頁面元素。 作為一個網站的前端開發工程師,應該避免編寫一些常見的開銷很大的CS...
摘要:一基本選擇器二后代選擇器子元素選擇器三兄弟選擇器四交集選擇器與并集選擇器五序列選擇器六屬性選擇器七偽類選擇器八偽元素選擇器九三大特性一基本選擇器選擇器作用根據指定的名稱,在當前界面中找到對應的唯一一個的標簽,然后設置屬性格式名稱屬性值注意點 一、 基本選擇器 二、 后代選擇器、子元素選擇器 三、 兄弟選擇器 四、 交集選擇器與并集選擇器 五、 序列選擇器 六、 屬性選擇器 七、 偽類選擇器 ...
閱讀 1117·2023-04-26 03:02
閱讀 1161·2023-04-25 19:18
閱讀 2583·2021-11-23 09:51
閱讀 2561·2021-11-11 16:55
閱讀 2614·2021-10-21 09:39
閱讀 1694·2021-10-09 09:59
閱讀 1991·2021-09-26 09:55
閱讀 3512·2021-09-26 09:55