css中如何改变超链接颜色

总体介绍

超链接文本可以通过CSS样式来控制其颜色，共有四种基本状态：

• 正常状态：默认的超链接文本颜色
• 已访问状态：当超链接文本被点击后，其颜色会变为已访问时的颜色
• 鼠标悬停状态：当鼠标在超链接上悬停时，超链接文本会变为鼠标悬停状态的颜色
• 正在被点击状态：当超链接文本正在被点击时，其颜色会变为正在被点击时的颜色

示例1：改变超链接文本颜色

可以通过为超链接文本设置color属性来改变其颜色，同时也可以去除下划线：

<a href="#" style="color:red;text-decoration:none">这是一个红色的超链接</a>

但更好的方式是通过CSS样式表单独设置超链接样式：

<style>
  a {
    color: red;
    text-decoration: none;
  }
</style>

示例2：改变已访问超链接文本颜色

已访问的超链接文本可以通过设置伪类a:visited的颜色来改变：

<style>
  a:visited {
    color: blue;
  }
</style>

示例3：改变鼠标悬停时的超链接文本颜色

鼠标悬停状态的超链接文本可以通过设置伪类a:hover的颜色来改变：

<style>
  a:hover {
    color: green;
  }
</style>

示例4：改变正在被点击时超链接文本颜色

正在被点击状态的超链接文本可以通过设置伪类a:active的颜色来改变：

<style>
  a:active {
    color: yellow;
  }
</style>

总结

通过设置超链接文本的伪类，可以控制超链接在不同状态下的文本颜色。更好的方式是通过CSS样式表单独设置超链接样式，使得超链接在整个页面中风格一致。同时可以去除默认的下划线，使页面更加美观。