CSS Links (link)

CSS link

Different links can have different styles.

Link style

Linked styles can be used with any CSS property (e.g. color, font, background, etc.).

Special links can have different styles, depending on what state they are in.

The four link states are:

• a:link - Normal, unresoled links
• a:visited - a link that the user has visited
• a:hover - When the user mouses on the link
• a:active - the moment the link was clicked

When styled to several link states, there are also some sequential rules:

• a:hover must follow a:link and a:visited
• a:active must follow a:hover

Tip: In this site's CSS reference manual, we have a detailed description of the CSS:link selector.

Common link styles

Based on the example of the color change of the link above, see what state it is in.

Let's go to the link style in some other common way:

Text decoration

text-decoration is primarily used to remove underscores from links:

The background color

The background color property specifies the linked background color:

More Examples

Add hyperlinks with different styles
This example shows how to add additional styles to hyperlinks.

Advanced - Create a link box
This example demonstrates a more advanced example where we combine several CSS properties to appear as boxes.