CSS Tutorials and CSS Articles » CSS Links http://www.cssmaster.co.uk CSS tutorials and articles Tue, 02 Feb 2010 01:43:09 +0000 http://wordpress.org/?v=2.9.1 en hourly 1 CSS Link Styling http://www.cssmaster.co.uk/css-link-styling http://www.cssmaster.co.uk/css-link-styling#comments Fri, 15 Jan 2010 18:37:51 +0000 CSS Master http://www.cssmaster.co.uk/?p=28 CSS can be a powerful tool when styling links on your web page.

You can change the look of the link itself using traditional CSS Font Styling and CSS Styling Text, but links also have extra behaviours that can be styled.

A link is an anchor, the HTML for an anchor tag is , so the CSS is:
a:link { color:#fff; }
a:visited { color:red; }
a:hover { color:blue; }
a:active { color:yellow; }
:link – An unvisited link
:visited – A link that has been visited
:hover – When the mouse hovers over a link
:active – The selected link

Ofcourse you can completely customise these links, whether that’s with a background color, a border or a text styling underline. By default the links are blue with an underline. ‘active’ links are red by default and visited links are purple.

An example of a link styled as a button:
a {
  padding:10px;
  margin:5px;
  background-color:#eee;
  color:#000;
  border:1px solid #ccc;
}

a:hover{
  background-color:#999;
  color:#fff;
}
A link with the :hover select

]]> http://www.cssmaster.co.uk/css-link-styling/feed 0