CSS 選擇器參考手冊
http://www.w3school.com.cn/cssref/css_selectors.asp
我們會定期對 W3School 的 CSS 參考手冊進(jìn)行瀏覽器測試鳄逾。
CSS3 選擇器
在 CSS 中锰镀,選擇器是一種模式,用于選擇需要添加樣式的元素侦讨。
"CSS" 列指示該屬性是在哪個 CSS 版本中定義的吟策。(CSS1儒士、CSS2 還是 CSS3。)
選擇器例子例子描述CSS
.class.intro選擇 class="intro" 的所有元素檩坚。1
#id#firstname選擇 id="firstname" 的所有元素着撩。1
**選擇所有元素。2
elementp選擇所有
元素匾委。1
element,elementdiv,p選擇所有
元素拖叙。1
element?elementdiv p選擇
元素。1
element>elementdiv>p選擇父元素為
元素赂乐。2
element+elementdiv+p選擇緊接在
元素薯鳍。2
[attribute][target]選擇帶有 target 屬性所有元素。2
[attribute=value][target=_blank]選擇 target="_blank" 的所有元素挨措。2
[attribute~=value][title~=flower]選擇 title 屬性包含單詞 "flower" 的所有元素挖滤。2
[attribute|=value][lang|=en]選擇 lang 屬性值以 "en" 開頭的所有元素。2
:linka:link選擇所有未被訪問的鏈接浅役。1
:visiteda:visited選擇所有已被訪問的鏈接斩松。1
:activea:active選擇活動鏈接。1
:hovera:hover選擇鼠標(biāo)指針位于其上的鏈接觉既。1
:focusinput:focus選擇獲得焦點(diǎn)的 input 元素砸民。2
:first-letterp:first-letter選擇每個
元素的首字母。1
:first-linep:first-line選擇每個
元素的首行。1
:first-childp:first-child選擇屬于父元素的第一個子元素的每個
元素岭参。2
:beforep:before在每個
元素的內(nèi)容之前插入內(nèi)容反惕。2
:afterp:after在每個
元素的內(nèi)容之后插入內(nèi)容。2
:lang(language)p:lang(it)選擇帶有以 "it" 開頭的 lang 屬性值的每個
元素演侯。2
element1~element2p~ul選擇前面有
元素的每個
- 元素姿染。3
[attribute^=value]a[src^="https"]選擇其 src 屬性值以 "https" 開頭的每個 元素。3
[attribute$=value]a[src$=".pdf"]選擇其 src 屬性以 ".pdf" 結(jié)尾的所有 元素秒际。3
[attribute*=value]a[src*="abc"]選擇其 src 屬性中包含 "abc" 子串的每個 元素悬赏。3
:first-of-typep:first-of-type選擇屬于其父元素的首個
元素的每個
元素。3
:last-of-typep:last-of-type選擇屬于其父元素的最后
元素的每個
元素娄徊。3
:only-of-typep:only-of-type選擇屬于其父元素唯一的
元素的每個
元素闽颇。3
:only-childp:only-child選擇屬于其父元素的唯一子元素的每個
元素。3
:nth-child(n)p:nth-child(2)選擇屬于其父元素的第二個子元素的每個
元素寄锐。3
:nth-last-child(n)p:nth-last-child(2)同上兵多,從最后一個子元素開始計數(shù)。3
:nth-of-type(n)p:nth-of-type(2)選擇屬于其父元素第二個
元素的每個
元素橄仆。3
:nth-last-of-type(n)p:nth-last-of-type(2)同上剩膘,但是從最后一個子元素開始計數(shù)。3
:last-childp:last-child選擇屬于其父元素最后一個子元素每個
元素盆顾。3
:root:root選擇文檔的根元素怠褐。3
:emptyp:empty選擇沒有子元素的每個
元素(包括文本節(jié)點(diǎn))。3
:target#news:target選擇當(dāng)前活動的 #news 元素您宪。3
:enabledinput:enabled選擇每個啟用的 元素奈懒。3
:disabledinput:disabled選擇每個禁用的 元素3
:checkedinput:checked選擇每個被選中的 元素。3
:not(selector):not(p)選擇非
元素的每個元素宪巨。3
::selection::selection選擇被用戶選取的元素部分磷杏。3