css pseudo-class is used to define special states of elements. It can be used to: 1. Set the style when the mouse is hovering over the element; 2. Set different styles for visited and unvisited links; 3. Set the style when the element gets focus.
#The operating environment of this article: Windows 7 system, css3 version, Dell G3 computer.
What are pseudo-classes?
Pseudo classes are used to define special states of elements.
For example, it can be used to:
Set the style when the mouse is hovering over the element
is visited Set different styles from unvisited links
Set the style when the element gets focus
Syntax
Syntax of pseudo-class:
selector:pseudo-class { property: value; }
Anchor pseudo-class
Links can be displayed in different ways:
Instance
/* 未访问的链接 */ a:link { color: #FF0000; } /* 已访问的链接 */ a:visited { color: #00FF00; } /* 鼠标悬停链接 */ a:hover { color: #FF00FF; } /* 已选择的链接 */ a:active { color: #0000FF; }
Note: a:hover must be after a:link and a:visited in the CSS definition to take effect! a:active must be after a:hover in the CSS definition to take effect! Pseudo class names are not case sensitive.
Pseudo classes and CSS classes
Pseudo classes can be used in conjunction with CSS classes:
When you hover over the link in the example When, it will change color:
Example
a.highlight:hover { color: #ff0000; }
Recommended learning: "css video tutorial"
The above is the detailed content of What is css pseudo class. For more information, please follow other related articles on the PHP Chinese website!