CSS Link Styling
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
