HTML Links - Different Colors
HTML links will be displayed in different colors depending on whether they have been visited, are unvisited, or are active.
HTML Link Colors
By default, a link will appear like this (in all browsers):
- An unvisited link is underlined and blue
- A visited link is underlined and purple
- An active link is underlined and red
You can change the default colors, by using CSS:
Example
<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>
Try it Yourself »
Link Buttons
A link can also be styled as a button, by using CSS:
This is a linkExample
<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>
Try it Yourself »
To learn more about CSS, go to our CSS Tutorial.
HTML Link Tags
| Tag | Description |
|---|---|
| <a> | Defines a hyperlink |
For a complete list of all available HTML tags, visit our HTML Tag Reference.
