HTML Link Attributes

When you have a link in your HTML page, you can assign state to the link. These states indicate the action that has happened on the link. The following state can be assigned to a link on a page:

 

Link

Visited

Hover

Active

 

Link indicates that the link in the page has not been used nor has the mouse moved over it. Hover indicates that the mouse pointer is over the link. Visited indicates that the link has been used or taken.  Active indicates that the link is being clicked.

 

These four states activate according to the action taken on the link. Here is a look at how this goes in coding:

 

a:link {

color: brown;

background-color: white;

font-size: 18px;

font-family: sans-serif;

text-transform: lowercase;

text-decoration: none;

}

 

The above coding gives the state of the link, before even the mouse moves over it. The link appears in brown color and in lowercase, with a background color of white, in font size of 18 px.

 

a:visited {

color: pink;

background-color: blue;

font-size: 18px;

font-family: sans-serif;

text-transform: uppercase;

text-decoration: none;

}

 

The above coding gives the state of the link, after it has been visited. The link appears in uppercase, with a background color of blue, in font size of 18 px.

 

 

a:hover{

color: blue;

background-color: white;

font-size: 18px;

font-family: serif;

text-transform: uppercase;

text-decoration: line-through;

 

}

 

The above coding gives the state of the link, when the mouse hovers over it. The link appears in uppercase, with a background color of white, in font size of 18 px and a text decoration that has a line through the text.

css.php