伪类 - CSS(层叠样式表) 编辑

CSS 伪类 是添加到选择器的关键字,指定要选择的元素的特殊状态。例如,:hover 可被用于在用户将鼠标悬停在按钮上时改变按钮的颜色。

/* 所有用户指针悬停的按钮 */
button:hover {
  color: blue;
}

伪类连同伪元素一起,他们允许你不仅仅是根据文档 DOM 树中的内容对元素应用样式,而且还允许你根据诸如像导航历史这样的外部因素来应用样式(例如 :visited),同样的,可以根据内容的状态(例如在一些表单元素上的 :checked),或者鼠标的位置(例如 :hover 让你知道是否鼠标在一个元素上悬浮)来应用样式。

注意: 与伪类相反,pseudo-elements 可被用于为一个元素的 特定部分 应用样式。

语法

selector:pseudo-class {
  property: value;
}

类似于普通的类,你可以在一个选择器中同时一起写多个伪类。

标准伪类索引

规范

规范状态备注
Fullscreen APILiving StandardDefined :fullscreen.
HTML Living StandardLiving StandardDefines when particular selectors match HTML elements.
Selectors Level 4Working DraftDefined :any-link:blank:local-link:scope:drop:current:past:future:placeholder-shown:user-invalid:nth-col():nth-last-col():is() and :where().
Changed :empty to behave like :-moz-only-whitespace  .
No significant change for other pseudo-classes defined in Selectors Level 3 and HTML5 (though semantic meaning not taken over).
HTML5RecommendationCopies the relevant section from the canonical (WHATWG) HTML spec.
CSS Basic User Interface Module Level 3RecommendationDefined :default:valid:invalid:in-range:out-of-range:required:optional:read-only and :read-write, but without the associated semantic meaning.
Selectors Level 3RecommendationDefined :target:root:nth-child():nth-last-of-child():nth-of-type():nth-last-of-type():last-child:first-of-type:last-of-type:only-child:only-of-type:empty and :not().
Defined the syntax of :enabled:disabled:checked, and :indeterminate, but without the associated semantic meaning.
No significant change for pseudo-classes defined in CSS Level 2 (Revision 1).
CSS Level 2 (Revision 1)RecommendationDefined :lang():first-child:hover, and :focus.
No significant change for pseudo-classes defined in CSS Level 1.
CSS Level 1RecommendationDefined :link:visited and :active, but without the associated semantic meaning.

参见

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

词条统计

浏览:138 次

字数:12992

最后编辑:7年前

编辑次数:0 次

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文