DivCSS layout basics: How to correctly define CSS pseudo-classes?

Author：Eve Cole Update Time：2009-06-07 16:06:50

In CSS web page layout, the issue of CSS pseudo-classes will inevitably be involved. How to correctly define CSS pseudo-classes? Although there are many related introductions on this site, it doesn't hurt to review them. You can understand it by looking at the code below.

Example Source Code [www.downcodes.com]

a.w3cbbs{text-decoration:none;}
a.w3cbbs:link{color:#f90;}
a.w3cbbs:hover{color:#fff;background-color:#FF5900;}
a.w3cbbs:active{color:#FF5900;}

<a href="http://www.downcodes.com/" class="w3cbbs">The first way of writing - Source Code Network</a>

Example Source Code [www.downcodes.com]

a .nav2 {color: #777;text-decoration: none;}
a:link .nav2 {color: #777;}
a:hover .nav2 {color: #f60;}
a:active .nav2 {color: #f60;}

<a href="http://www.downcodes.com/">
<span class="nav2">The second way of writing - Source Code Network</span>
</a>

Example Source Code [www.downcodes.com]

.www52css a {text-decoration: none;color: #ccc; }
.www52css a:visited {color: #ccc;}
.www52css a:hover {color: #f60;}

<span class="wwwdowncodes">
<a href="http://www.downcodes.com/">The third way of writing - Source Code Network</a>
</span>