In CSS, we can set the style of hyperlinks through pseudo-classes. For example, if we want to set the style of unvisited hyperlinks, the code is like [a:link {color: #FF0000;}], and set the style of visited hyperlinks. Link style, code such as [a:visited {color: #00FF00;}].
The operating environment of this article: windows10 system, css 3, thinkpad t480 computer.
If we want to set the style of a hyperlink, we can do it through css pseudo-classes. The following is a detailed introduction to css 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:
selector:pseudo-class { property: value; }
Code example:
/* 未访问的链接 */ 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.
Related video sharing: css video tutorial
The above is the detailed content of How to style hyperlinks with css. For more information, please follow other related articles on the PHP Chinese website!