CSS Links

Last Updated Jul 21, 2015, 12:00:06 PM




CSS Links

CSS links are used to style the urls or web links on the internet based on their state and behaviour

Every link we see on the internet can be styled in different colors. We can style a link in blue color or red color or black color etc..

Links can be styled with any CSS property (e.g. color, font-family, background, etc.).

Example
Try It Now

Example


Try It Now

We have four different types of link states in CSS

The four links states are:

a:link - a normal, unvisited link

Example
Try It Now

Example

a:visited - a link the user has visited

Try It Now

a:hover - a link when the user mouses over it

Try It Now

a:active - a link the moment it is clicked

Example
Try It Now

Target Attribute Values _blank:

Opens the linked document in a new window or tab

_self:

Opens the linked document in the same frame as it was clicked (this is default)

_parent:

Opens the linked document in the parent frame

_top:

Opens the linked document in the full body of the window


Try It Now

Background Color

The background-color property specifies the background color for links:

Example
Try It Now

Browser compatibility
Feature
Basic support 1 1.0 (1.7 or earlier) 1.0 3.5 3.5 1.5 3.2


Practice with our Interactive Live Code Editors and Take your CSS Skills to the Next Level

CSS Links Practice

Exercise 1 Exercise 2 Exercise 3 Exercise 4 Exercise 5



Sources and Credits

The source of the content has been referred and updated with Mozilla Foundation and W3C Organization

Last Updated Jul 21, 2015, 12:00:06 PM