首页 > 网页设计

CSS定义链接样式

发布时间:2010-07-17 22:50:41 来源:星知苑 作者:星之宇

a:link 定义正常链接的样式;
a:visited 定义已访问过链接的样式;
a:hover 定义鼠标悬浮在链接上时的样式;
a:active 定义鼠标点击链接时的样式。
链接定义的顺序:link visited hover active[break]

例如:
a:link {color:#FF0000;text-decoration:underline;}
a:visited {color:#00FF00;text-decoration:none;}
a:hover {color:#000000;text-decoration:none;}
a:active {color:#FFFFFF;text-decoration:none;}
示例中定义的链接颜色是红色,访问过后的链接是绿色,鼠标悬浮在链接上时是黑色,点击时的颜色是白色。

如果正常链接和已访问过的链接样式相同,鼠标悬浮和点击时的样式相同,也可以将它们合并起来定义
a:link,a:visited {color:#FF0000;text-decoration:underline;}
a:hover,a:active {color:#000000;text-decoration:none;}

定义局部链接样式
#sidebar a:link {color:#FF0000;text-decoration:underline;}
#sidebar a:visited {color:#00FF00;text-decoration:none;}
#sidebar a:hover {color:#000000;text-decoration:none;}
#sidebar a:active {color:#FFFFFF;text-decoration:none;}
调用方法:

<div id="sidebar"><a href="http://www.myxzy.com" target="_blank">星知苑</a></div> 

class的定义方法和id相同,只要将#sidebar改为.sidebar就行了。

一个一个定义
a.redlink a:link,a.redlink a:visiteid {color:#FF0000;text-decoration:none;}
a.redlink a:hover,a.redlink a:active {color:#000000;text-decoration:underline;background:#FFFFFF;}
调用方法:

<div><a class="redlink" href="http://www.myxzy.com" target="_blank">星知苑</a></div>

相关合集

  • 经典fc游戏大全安卓版
经典fc游戏大全安卓版

简介:小的时候总是会在家里叫上几个小玩伴一起坐在地上开着风扇,玩红白机超级玛丽坦克大战魂斗罗三国志等等一张卡带都是有很多的不同的游戏,轮流上场两两对战多种好玩的游戏,每次都是玩得不亦乐乎开怀大笑,本站小编专门花了大量的时间去寻找到很多的手机可以玩的FC游戏,再次唤醒你的童心。