Published on: 06 August, 2013

CSS Links

Posted by andy | 1265 views 0 likes 0 favourites 0 comments
Tumblr Digg Google Plus

In CSS, you have 4 available properties to define the states of hyperlinks.

Property Name Description Example
a:active A link will become active when you click on the link.
a:active {color:yellow}
a:link Apply to all links that are not visited yet
a:link {text-decoration:none;}
a:visited Apply to links that have been clicked or visited.
a:visited {color:red}
a:hover Apply the action, when you hover your mouse over the links.
a:hover {text-decoration:underline;}

Examples

Please see the following quick examples on how each link state is used.

CSS Style Result
a:link{
    color:blue;
    text-decoration:none;
    font-weight:normal;
}

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

a:visited{
	text-decoration:underline;
	color:green;
}

a:active{
	font-weight:bold;
	color:#black;
}
Click here
Comments

There are no comments available.

Write Comment
0 characters entered. Maximum characters allowed are 1000 characters.
Related Articles
Published on: 20 May, 2016
Do you need to create a beautiful, simple and elegant pagination links with css? Simply follow our easy and quick tutorial on how to create the pagination links easily with CSS.
Published on: 31 January, 2016
The easy way to optimize your site for printing is to create a separated external css targeting a media to print only. When a printing action is being executed, the browser will send over the information from your page to the printer. It will also check if there is any specific style sheet that will be used for printing mode only. If there is, it will then render the page content using the media print css file. Therefore the page you see in the printer paper may completely looks different with the one you see in a page. The idea of optimizing in here is to hide unnecessary content.