CSS中的各種選擇器與樣式優(yōu)先級小結(jié)

優(yōu)先級：由高到低(從上到下)

!important

內(nèi)聯(lián)(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)是加在選擇器后面的用來指定元素狀態(tài)的關(guān)鍵字。

鏈接相關(guān)a:link 未訪問的鏈接

a:visited 已訪問的鏈接

a:hover 鼠標(biāo)移動到鏈接上

a:active 選定的鏈接

:target 可用于選取當(dāng)前活動的目標(biāo)元素,href="#222"(內(nèi)容跳轉(zhuǎn))

表單元素相關(guān):focus 偽類在元素獲得焦點時向元素添加特殊的樣式

:disabled 匹配每個被禁用的元素(大多用在表單元素上)。

:enabled 表示任何啟用的(enabled)元素

:checked 匹配每個已被選中的 input 元素(只用于單選按鈕和復(fù)選框)(只有opera支持)

父子相關(guān):empty 代表沒有子元素的元素，只計算元素結(jié)點及文本(包括空格)，注釋、運行指令不考慮在內(nèi)。

:first-child 代表了某個元素，這個元素是它父元素的的第一個子元素

CSS Code復(fù)制內(nèi)容到剪貼板

:first-of-type

:last-of-type

:nth-clild(n) 選擇器匹配屬于其父元素的第 N 個子元素，不論元素的類型

n 可以是數(shù)字、關(guān)鍵詞或公式(2,an + b,odd)(n 是計數(shù)器(從 0 開始)，b 是偏移值)

:nth-last-child(n)倒數(shù)

:nth-of-type(n)

屬性選擇器E[attr]

E[attr=value]

E[attr~=value] 選擇器用于選取屬性值中包含指定詞匯的元素

E[attr^=value] 選擇器匹配屬性值以指定值開頭的每個元素。

父子關(guān)系

A E 任何是元素A的后代元素E (后代節(jié)點指A的子節(jié)點，子節(jié)點的子節(jié)點，以此類推)

A > E 任何元素A的子元素(直接)

CSS Code復(fù)制內(nèi)容到剪貼板

E[attr*=value]

E[attr$=value]

基于關(guān)系的選擇器

兄弟關(guān)系

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 在元素之前添加內(nèi)容。

E:after 在元素之后添加內(nèi)容。相關(guān)閱讀:

深入解析C++的循環(huán)鏈表與雙向鏈表設(shè)計的API實現(xiàn)

CSS定義超鏈接樣式的順序及四個偽類的用法示例介紹

sql server中查找特定類別的列的寫法

ASP.NET驗證碼實現(xiàn)(附源碼)

Win10預(yù)覽版10525出現(xiàn)錯誤代碼0x8007232B的原因

JavaScript實現(xiàn)當(dāng)網(wǎng)頁加載完成后執(zhí)行指定函數(shù)的方法

CSS重要屬性之 margin 屬性知識大整合(必看篇)

純javascript響應(yīng)式樹形菜單效果

win7系統(tǒng)無法登錄阿里旺旺怎么辦？win7系統(tǒng)電腦無法登錄阿里旺旺聊天的多種解決方法

Win7開機黑屏提示“explorer無法啟動uxtheme.dll丟失”的解決方法

C#版Windows服務(wù)安裝卸載小工具

js實現(xiàn)不提交表單獲取單選按鈕值的方法

Ubuntu 14.04中啟用本地菜單的方法

SQLite教程(二)：C/C++接口簡介

總結(jié)

以上是生活随笔為你收集整理的html中基本选择器的优先级,CSS_CSS中的各种选择器与样式优先级小结，优先级：由高到低(从上到下)- phpStudy...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。