超链接a标签定义显示不同颜色及有无下划线

　　超链接a标签有四种链接状态，其中有两种需要用CSS样式定义，一种在网页中显示的颜色（打开网页时显示的颜色），另一种是鼠标移上去显示的颜色。在定义这两种颜色的时候，定义了一种，一个页面的所有超链接都用这种样式，然而有时部分超链接想用另外的颜色，此时又该如何定义呢？

　　在CSS中，如果既想使用前面样式定义的属性，又想使某些属性仅部分内容独有，可以用CSS样式名称来限制；同样的定义也适合超链接a，只需要用当前的CSS名称限制就能使用或修改前面定义的颜色，具体看下面的实例。另外，超链接默认都显示下划线的，如果不想要，可以把它定义为无。

　　一、超链接a标签定义显示不同颜色

　　html代码：

　　<ul class="ul">
　　　<li><a href="" rel="nofollow">红色链接，鼠标移上去变绿色</a></li>
　　</ul>
　　<div class="div"><a href="" rel="nofollow">蓝色链接，鼠标移上去变粉红色</a></div>

　　CSS样式：

　　<style type="text/css">
　　　.ul{line-height:26px; list-style:none;}
　　　a{color:Red;} a:hover{color:#1ed905;}
     
　　　.div{overflow:hidden;}
　　　.div a{color:#0a49e8;} .div a:hover{color:#ee88bb;}
　　</style>

　　Css样式定义的 a{} a:hover{} 是整个页面的超链接样式，下面的div也应用这样的样式，为使div中的链接使用蓝色和粉红色，所以在标签a的前面加了.div又定义了一次a的样式。

　　二、超链接a标签有无下划线的定义

　　默认情况下，链接是一直显示下划线的，如果不想让它显示下划线，可以把它定义为无，也可以定义为鼠标移上去再显示下划线，看下面的实例。

　　1、把超链接定义无下线线

　　html代码：

　　<div class="nounderline"><a href="" rel="nofollow">无下画线链接</a></div>

　　Css样式：

　　.nounderline{overflow:hidden; margin-top:10px;}
　　.nounderline a{text-decoration:none;}

　　2、把超链接定义为鼠标移上去显示下线线

　　在“把超链接定义无下线线”基础上，增加一个CSS样式即可：

　　.nounderline a:hover{text-decoration:underline;}