2003年09月17日 09:59 点击:超过8000次
超链接变色,需要用样式表CSS来控制。关于CSS的概念,请看《样式表简明教程》,详细而且精炼、通俗,我想,很有必要阅读一下。
前面已经讲过如何控制超链接下划线了,详见去超链接下划线专题详解。下面将举三个实例来说明如何控制超链接变色。用记事本打开网页源代码(也可以先用IE打开网页,然后点击IE菜单栏的“查看→源文件”),然后弹出的网页代码如下:
<html>
<head>
<title>超链接变色专题 - 网页树树</title>
</head>
<body>
……
</body>
找到<head>和</head>这两句,样式表语句就加在它们中间。如下:
<html>
<head>
<style>a{color:000000}a:hover{color:8f601f}</style>
</head>
<body>
上述代码效果如下,请把鼠标停留在下面的超链接上:
说明:color后面的值,是html的颜色代码,由六个字符组成:rrggbb,每一位都是十六进制,从0~9~a~f,所以可以产生166种颜色,也就是1677万多种颜色。(166=16777216)。使用什么颜色,要看网站的主体颜色,下面举几种颜色的例子:
网页树树颜色代码:3160c1
网页树树颜色代码:999900
网页树树颜色代码:ff0000
网页树树颜色代码:004000
上面的例子说明如何一次性定义网页所有的超链接颜色,平时只要<style>a{color:000000}a:hover{color:8f601f}</style>这句就足够了。a{color}表示超链接的颜色,a:hover{color}表示鼠标悬停在超链接上面时的颜色。
如果想让网页中有多种变幻的颜色,我认为大可不必,反而会让网页变得杂乱。除非你要做游戏类网站,或者其它很酷的效果,但是切记颜色不要太多种,要在同一个色系内,才会让它达到统一。具体方法与超链接去下划线的方法一样,详见这里,请看例二和例三。
二、如何让超链接去下划线、超链接变色?
如果你明白了a{ }和a:hover{ }它们的意义,就很容易控制了,在这里再举两个实例:
<style>a{text-decoration:none;color:000000}a:hover{color:ff0000}</style>
请把鼠标停留在超链接上面,效果如下:
<style>a{text-decoration:none;color:000000}a:hover{text-decoration:underline;color:ff0000}</style>
请把鼠标停留在超链接上面,效果如下:
网页树树版权声明:
此文为Webshu.com独家撰稿,著作权属作者所有,禁止转载。
此文网址 http://webshu.cn/column/102/7.html