Home >Web Front-end >HTML Tutorial >CSS pseudo-class and pseudo-object selection (5)_html/css_WEB-ITnose
Pseudo-selectors include: pseudo-class selectors and pseudo-object selectors, prefixed with a colon (:), followed by a pseudo-class or Pseudo object name, there are no spaces before and after the colon, otherwise it will be parsed as containing the selector
such as:
div:hover{ font-size:12px;}/*div为指定标签名hover选择符,伪类 或者 伪元素名*/
Pseudo selector is specially used Select elements or objects in special areas or special states. These special areas or special states cannot be precisely controlled through tag selectors, ID selectors or class selectors
伪类 | 说明 |
:focus | 定义对象在成为输入焦点(该对象的onfocus事件发生时)的样式 |
:first-child | 定义对象的第一个子对象的样式 |
:first | 定义页岩 容器第一页使用的样式,仅适用于@page规则 |
:left | 定义页面容器位于装订线左边的所有页面使用的样式,仅适用于@page规则 |
:right | 定义页面容器位于装订线右边的所有页面使用的样式,仅适用于@page规则 |
:lang | 定义对象使用特殊语言的内容样式 |
伪对象 | 说明 |
:after | 与content属性一起使用,定义在对象后的内容 |
:before | 与content属性一起使用,定义在对象前的内容 |
:first-letter | 定义对象内第一个字符的样式 |
:first-line | 定义对象内第一行的样式 |
@charset "utf-8";/* CSS Document *//*超链接默认样式*/a{ text-decoration:none; color:#333333;}/*访问过的样式*/a:visited{ color:#0000ff;}/*鼠标经过样式*/a:hover{ color:#00ff00;}/*鼠标按下样式*/a:active{ color:#FF0000;
There is another one: link can define unvisited Hyperlink style, you can use a selector instead of a:link selector style.
: link and :visited are called link pseudo-classes and can only be applied to anchor elements;
:hover, :active and :focus are called dynamic Pseudo-class, which can theoretically be applied to any element.