This article mainly introduces about setting the font color of hyperlinks and the font color after clicking in HTML. It has a certain reference value. Now I share it with you. Friends in need can refer to it.
CSS for some Special effects prepare specific tools, which we call "pseudo-classes". There are several of them that we often use. Below we will introduce in detail the four pseudo-classes that are often used to define link styles.
Definition of link styles
CSS has prepared specific tools for some special effects. , we call it "pseudo-class". There are several of them that we often use. Below we will introduce in detail the four pseudo-classes that are often used to define link styles. They are:
:link
:visited
:hover
:active
Because we want to define the link style, the anchor tag in the hyperlink - a is essential. The method of writing the anchor tag and pseudo-class link is the basic method of defining the link style. Their The writing method is as follows:
a:link, defines the style of normal links;
a:visited, defines the style of visited links;
a:hover, defines the style when the mouse is hovering over the link;
a:active, defines the style when the mouse clicks on the link.
Example:
a:link { color:#FF0000; text-decoration:underline; } a:visited { color:#00FF00; text-decoration:none; } a:hover { color:#000000; text-decoration:none; } a:active { color:#FFFFFF; text-decoration:none; }
The link color defined in the above example is red, the visited link is green, the link is black when the mouse is hovering over it, and the link is white when clicked.
If the normal link has the same style as the visited link, and the style when the mouse is hovering and clicking is the same, they can also be combined to define:
a:link, a:visited { color:#FF0000; text-decoration:underline; } a:hover, a:active { color:#000000; text-decoration:none; }
The order of link definition
There is no rule without rules. , although the link definition has been written, it also has rules. If the writing order of these four items is slightly wrong, the effect of the link may be lost, so be sure to confirm the order of definition every time you define a link style, link-- visited--hover-active, which is what we often call the LoVe HAte principle (the capital letters are their first letters).
Define local link style
Writing a definition like a:link{} in CSS will change the link style of the entire page, but some local links need to be specialized. This problem is not difficult to solve, as long as the link Just add the specified id or class in front of the style definition.
Example:
#sidebar a:link, #sidebar a:visited { color:#FF0000; text-decoration:none; } #sidebar a:hover, #sidebar a:active { color:#000000; text-decoration:underline; }
Calling method:
a.redlink a:link, a.redlink a:visited { color:#FF0000; text-decoration:none; } a.redlink a:hover, a.redlink a:active { color:#000000; text-decoration:underline; background:#FFFFFF; }
Calling method:
above That’s the entire content of this article. I hope it will be helpful to everyone’s study. For more related content, please pay attention to the PHP Chinese website!
Related recommendations:
CSS
Introduction to the use of Border attribute solid
#css
Explanation of background:transparent
The role of meta in the html page and the analysis of the cache and non-caching settings of the page
The above is the detailed content of Set the font color of hyperlinks and the font color after clicking through HTML. For more information, please follow other related articles on the PHP Chinese website!