目录

HTML 链接 - 不同颜色

❮ 上一节下一节 ❯

HTML 链接根据其是否已被访问、未访问或处于活动状态而以不同的颜色显示。

HTML 链接颜色

默认情况下，链接将如下所示（在所有浏览器中）：

未访问的链接带有下划线且呈蓝色
访问过的链接带有下划线且呈紫色
活动链接带有下划线并呈红色

您可以使用 CSS 更改链接状态颜色：

示例

在这里，未访问的链接将是绿色的，没有下划线。访问过的链接将是粉红色的，没有下划线。活动链接将为黄色并带有下划线。此外，当鼠标悬停在链接上时（a:hover），它会变成红色并带有下划线：

<style>
a:link {
  color: green;
  background-color: transparent;
  text-decoration: none;
}

a:visited {
color: pink;
background-color: transparent;
text-decoration: none;
}

a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
}

a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
}
</style>

亲自试一试 »

链接按钮

还可以使用 CSS 将链接样式设置为按钮：

这是一个链接

示例

<style>
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 15px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}

a:hover, a:active {
background-color: red;
}
</style>

亲自试一试 »

要了解有关 CSS 的更多信息，请访问我们的CSS 教程。

HTML 链接标签

Tag	Description
<a>	Defines a hyperlink

有关所有可用 HTML 标签的完整列表，请访问我们的HTML 标签参考。

HTML练习

❮ 上一节下一节 ❯