HTML Links - Different Colors

[Guest]

HTML Links - Different Colors


An HTML link is displayed in a different color depending on
whether it has been visited, is unvisited, or is 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 link state colors, by using CSS:

Example
Here, an unvisited link will be green with no underline. A visited link
will be pink with no underline. An active link will be yellow and underlined.
In addition, when mousing over a link (a:hover) it will become red and underlined:

<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 link

Example

<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.













★
+1

Reference: https://www.w3schools.com/html/html_links_colors.asp