html 点击<a>元素后颜色的变换

猪猪猪猪猪鸭

于 2018-03-23 00:23:03 发布

阅读量1.8w

点赞数 1

CC 4.0 BY-SA版权

分类专栏： html a标签前端文章标签： html a标签前端

原文链接：https://blog.youkuaiyun.com/qq_21792169/article/details/50950680

前端同时被 3 个专栏收录

5 篇文章

订阅专栏

html

1 篇文章

订阅专栏

a标签

1 篇文章

订阅专栏

本文介绍了如何使用CSS伪类a:link、a:visited、a:hover和a:active来定义网页中不同状态链接的颜色和装饰效果。通过具体示例展示了如何为未访问、已访问、悬停和激活状态下的链接设置样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

可以利用CSS的伪类实现：

a:link，定义正常链接的样式；
a:visited，定义已访问过链接的样式；
a:hover，定义鼠标悬浮在链接上时的样式；
a:active，定义鼠标点击链接时的样式。

例子：

<style type="text/css">
a:link { 
color:#3C3C3C; 
text-decoration:underline; 
} 
a:visited { 
color:#0000FF; 
text-decoration:none; 
} 
a:hover { 
color:#FF00FF; 
text-decoration:none; 
} 
a:active { 
color:#D200D2; 
text-decoration:none; 
} 
</style>


<a href="http://baidu.com" target='_blank'>****</a>

例子说明：定义的链接颜色是

3C3C3C

，访问过后的链接是蓝色，鼠标悬浮在链接上时是

FF00FF

，点击时的颜色是

D200D2

。