Home >Web Front-end >Front-end Q&A >How to change the color of hyperlink in css
How to change the color of hyperlink in css
- 藏色散人Original
- 2021-04-13 09:48:089622browse
How to modify the hyperlink color in css: 1. Modify the hyperlink color through "a:link"; 2. Change the color through "a:visited"; 3. Change the color through "a:hover" setting; 4. Modify the color through "a:active".
The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.
css to modify the hyperlink color:
Everyone should be familiar with the hyperlink a tag. This article mainly talks about the basic css style setting of the a tag. Let’s take a look at how to modify the color of hyperlinks using css.
css can use the following pseudo-classes to set hyperlinks:
a:link: It is an unvisited style. You can add many things to it, such as removing underlines and changing colors. Other functions can be implemented here;
a:visited: It is the style after being clicked. You can also add many elements to it, and you can underline, change colors, zoom in and other functions;
a:hover: This is the mouse hover style. There will be examples of this later. Let’s get to know it first. You can set the color to change when the mouse is parked at the position of the hyperlink;
a: active: This is said to be an activated style. To put it simply, when you click the mouse, the style will appear instantly. This style is found on many websites;
Use the following style. Modifiable hyperlink color:
a:link{color:#000000;} /* 未访问链接*/
a:visited {color:#00FF00;} /* 已访问链接 */
a:hover {color:#FF00FF;} /* 鼠标移动到链接上 */
a:active {color:#0000FF;} /* 鼠标点击时 */Example:
<html>
<head>
<style type="text/css">
a:link {color:#000000;} /* 未访问链接*/
a:visited {color:#00FF00;} /* 已访问链接 */
a:hover {color:#FF00FF;} /* 鼠标移动到链接上 */
a:active {color:#0000FF;} /* 鼠标点击时 */
</style>
<title>test css</title>
</head>
<body>
<a href="#">PHP中文网</a>
</body>
</html>[Recommended learning: css video tutorial]
The above is the detailed content of How to change the color of hyperlink in css. For more information, please follow other related articles on the PHP Chinese website!