跳至主要內容

伪类

Sankgao约 629 字大约 2 分钟FrontendCSS3

所有 CSS 伪类

选择器例子例子描述
:activea:active选择活动的链接
:checkedinput:checked选择每个被选中的 <input> 元素
:disabledinput:disabled选择每个被禁用的 <input> 元素
:emptyp:empty选择没有子元素的每个 <p> 元素
:enabledinput:enabled选择每个已启用的 <input> 元素
:first-childp:first-child选择作为其父的首个子元素的每个 <p> 元素
:first-of-typep:first-of-type选择作为其父的首个 <p> 元素的每个 <p> 元素
:focusinput:focus选择获得焦点的 <input> 元素
:hovera:hover选择鼠标悬停其上的链接
:in-rangeinput:in-range选择具有指定范围内的值的 <input> 元素
:invalidinput:invalid选择所有具有无效值的 <input> 元素
:lang(language)p:lang(it)选择每个 lang 属性值以 "it" 开头的 <p> 元素
:last-childp:last-child选择作为其父的最后一个子元素的每个 <p> 元素
:last-of-typep:last-of-type选择作为其父的最后一个 <p> 元素的每个 <p> 元素
:linka:link选择所有未被访问的链接
:not(selector):not(p)选择每个非 <p> 元素的元素
:nth-child(n)p:nth-child(2)选择作为其父的第二个子元素的每个 <p> 元素
:nth-last-child(n)p:nth-last-child(2)选择作为父的第二个子元素的每个 <p> 元素,从最后一个子元素计数
:nth-last-of-type(n)p:nth-last-of-type(2)选择作为父的第二个 <p> 元素的每个 <p> 元素,从最后一个子元素计数
:nth-of-type(n)p:nth-of-type(2)选择作为其父的第二个 <p> 元素的每个 <p> 元素
:only-of-typep:only-of-type选择作为其父的唯一 <p> 元素的每个 <p> 元素
:only-childp:only-child选择作为其父的唯一子元素的 <p> 元素
:optionalinput:optional选择不带 "required" 属性的 <input> 元素
:out-of-rangeinput:out-of-range选择值在指定范围之外的 <input> 元素
:read-onlyinput:read-only选择指定了 "readonly" 属性的 <input> 元素
:read-writeinput:read-write选择不带 "readonly" 属性的 <input> 元素
:requiredinput:required选择指定了 "required" 属性的 <input> 元素
:rootroot选择元素的根元素
:target#news:target选择当前活动的 #news 元素(单击包含该锚名称的 URL)
:validinput:valid选择所有具有有效值的 <input> 元素
:visiteda:visited选择所有已访问的链接