- 超链接变色专题详解 作者：自由勇
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.com/column/102/7.html 关于我们 :: 使用帮助 :: 版权信息 :: 网站地图 :: 信息反馈
Copyright © 2003-2024 webshu.com 版权所有
