How to make use of CSS to control the style of hyperlinks

Web site production with CSS to control the style of hyperlinks, generally divided into four parts: A:active is the initial state of the hyperlink, A:hover is the situation when the mouse is put up, a:link is the mouse clicks, a:visited is the situation after the visit.

Three ways to control hyperlinks in CSS

1, through the corresponding hyperlink outside the parent CSS class CSS style to control the style of hyperlinks

Case Hyperlink Code <div class= "Yangshi" ><a href= "http://www.wangqi.com/" >CSS</a></a>

Corresponding CSS code

. Yangshi A{color: #333; text-decoration:none;}

. Yangshi a:hover {color: #CC3300; text-decoration:underline;}

2, through the link within the Set Class control hyperlink style CSS method

Case Hyperlink Code <a href=http://www.wangqi.com/class= "Yangshi" >CSS</a>

Corresponding CSS code

A.yangshi{color: #333; text-decoration:none;}

a.yangshi:hover {color: #CC3300; text-decoration:underline;}

This setting allows you to control the style of the CSS class in the link named "Yangshi" hyperlink

3, usually to the whole station hyperlink style method

A{color: #333; text-decoration:none;//To the whole station there is link text color style: #333; and immediately without underline text-decoration:none;

A:hover {color: #CC3300; text-decoration:underline;} The text color style to the mouse over the hyperlink changes to color: #CC3300, and the text link is underlined text-decoration:underline;