内容提要:本文讲解为同一页面设置两种不同的链接样式的方法。
QQ群中有网友提问如何在CSS文件里制定两种超链接颜色的样式?以及如何在页面中调用?其实有很多朋友在网页上实现不同链接有不同的颜色上不知如何处理,如果改a的属性,所有的链接都被更改。事实上,采用CSS样式实现这类效果还是比较简单,大家都能掌握。
我们先来看一下正常情况下的设置:
a:link 超链接的普通样式
a:visited 鼠标单击过的
a:hover 鼠标经过时的
a:active 鼠标单击时
a:link{text-decoration:none;} 无下划线
a:link{text-decoration:underline;} 有下划线
为了实现不同链接不同效果,我们要为不同效果的那个链接专门定义一个CSS规则。
比如:我们常规css是这样的: a:link{color:#ff0000},那么网页上所有链接的颜色都是:#ff0000。只需这样修改一下:
a:link{color:#ff0000}
.line1 a:link{color:#000000}
同时,在要改变颜色的链接前加上css定义:<span class=line1><a href="/">不同颜色的超链接</a></span>,这样,这个链接的颜色就改变了。