dvbbs
收藏本页
联系我们
论坛帮助
dvbbs
恢复默认设置
登录
注册
搜索
风格
论坛状态
论坛展区
我能做什么
>> 电脑网络管理、网页制作、免费素材、经验交流、软硬件......
搜一搜更多此类问题
肿瘤咨询在线论坛
→
站务服务
→
『 电脑网络 』
→ 超链接变色专题详解
您是本帖的第
1645
个阅读者
树形
打印
标题:
超链接变色专题详解
管理员
头衔: 义工
等级:管理员
威望:
1
文章:827
积分:4593
注册:2004年1月31日
楼主
超链接变色专题详解
以下内容含错误标记
<P>超链接变色,需要用样式表CSS来控制。关于CSS的概念,请看《<a href="http://www.webshu.com/tutorial/act/7,id=0322.htm" target="_blank" ><FONT color=#00006a>样式表简明教程</FONT></A>》,详细而且精炼、通俗,我想,很有必要阅读一下。 前面已经讲过如何控制超链接下划线了,详见<a href="http://www.webshu.com/tutorial/act/7,id=0201.htm" target="_blank" ><FONT color=#00006a>去超链接下划线专题详解</FONT></A>。下面将举三个实例来说明如何控制超链接变色。用记事本打开网页源代码(也可以先用IE打开网页,然后点击IE菜单栏的“查看→源文件”),然后弹出如下记事本窗口:[code]<SCRIPT src="../../js/t1.js"></Script> <STYLE>#o{margin-top:0}</STYLE> <TABLE> <TR><TD><TABLE> <TR><TD><TABLE cellSpacing=0 cellPadding=0 bgColor=#d4d0c8> <TR><TD><P><TABLE height=18 cellSpacing=0 cellPadding=0 bgColor=#0a246a> <TR><TD><TABLE height=18 cellSpacing=0 cellPadding=0 width=531 bgColor=#a6caf0> <TR><TD></TD></TR></TABLE></TD></TR></TABLE><P><TABLE cellSpacing=0 cellPadding=0> <TR><TD width=2><TD vAlign=top width=18 height=19><IMG src="http://www.webshu.com/t/n4.gif"> <TD vAlign=top width=461><P><B>webshu.htm - 记事本</B></P><TD vAlign=top width=34><P><IMG src="http://www.webshu.com/t/n1.gif"><IMG src="http://www.webshu.com/t/n2.gif"></P><TD vAlign=top><P><IMG src="http://www.webshu.com/t/n3.gif"></P></TD></TR></TABLE><Q>文件(<U>F</U>)编辑(<U>E</U>)搜索(<U>S</U>)帮助(<U>H</U>)</Q> <TEXTAREA><html><head><title>超链接变色专题 - 网页树树</title></head><body>……</body></html></TEXTAREA><Script src="../../js/t2.js"></script>[/code] 找到<head>和</head>这两句,样式表语句就加在它们中间。如下: <html><head><style>a{color:000000}a:hover{color:8F601F}</style></head><body> 上述代码效果如下,请把鼠标停留在下面的超链接上: <TABLE> <TR><TD><STYLE>a.xh{color:000000}a:hover.xh{color:8F601F}</STYLE><a href="http://www.webshu.com/" target="_blank" >网页树树</A><a href="http://www.cctv.com/" target="_blank" >中央电视台</A></TD></TR></TABLE>说明:Color后面的值,是HTML的颜色代码,由六个字符组成:RRGGBB,每一位都是十六进制,从0~9~A~F,所以可以产生16<SUP>6</SUP>种颜色,也就是1677万多种颜色。(16<SUP>6</SUP>=16777216)。使用什么颜色,要看网站的主体颜色,下面举几种颜色的例子: <TABLE> <TR><TD><A>网页树树</A>颜色代码:3160C1 <A>网页树树</A>颜色代码:999900 <A>网页树树</A>颜色代码:FF0000 <A>网页树树</A>颜色代码:004000</TD></TR></TABLE>上面的例子说明如何一次性定义网页所有的超链接颜色,平时只要<style>a{color:000000}a:hover{color:8F601F}</style>这句就足够了。a{color}表示超链接的颜色,a:hover{color}表示鼠标悬停在超链接上面时的颜色。 如果想让网页中有多种变幻的颜色,我认为大可不必,反而会让网页变得杂乱。除非你要做游戏类网站,或者其它很酷的效果,但是切记颜色不要太多种,要在同一个色系内,才会让它达到统一。具体方法与超链接去下划线的方法一样,<a href="http://www.webshu.com/tutorial/act/7,id=0201.htm" target="_blank" >详见这里</A>,请看例二和例三。 二、如何让超链接去下划线、超链接变色? 如果你明白了a{ }和a:hover{ }它们的意义,就很容易控制了,在这里再举两个实例: <style>a{TEXT-DECORATION:none;color:000000}a:hover{color:FF0000}</style> 请把鼠标停留在超链接上面,效果如下: <TABLE> <TR><TD><STYLE>a.dh{TEXT-DECORATION:none;color:000000}a:hover.dh{color:FF0000}</STYLE><a href="http://www.webshu.com/" target="_blank" >网页树树</A><a href="http://www.cctv.com/" target="_blank" >中央电视台</A></TD></TR></TABLE><style>a{TEXT-DECORATION:none;color:000000}a:hover{TEXT-DECORATION:underline;color:FF0000}</style> 请把鼠标停留在超链接上面,效果如下: <TABLE> <TR><TD><STYLE>a.gh{TEXT-DECORATION:none;color:000000}a:hover.gh{TEXT-DECORATION:underline;color:FF0000}</STYLE><a href="http://www.webshu.com/" target="_blank" >网页树树</A><a href="http://www.cctv.com/" target="_blank" >中央电视台</A></TD></TR></TABLE></P></TD></TR></TABLE></TD></TR></TABLE></TD></TR></TABLE></P>
我是网站清洁工。
2005-7-30 17:54:24
1
1
1/1页
1
发短信
购买论坛点券
我能做什么
我发表的主题
我参与的主题
基本资料修改
用户密码修改
联系资料修改
用户短信服务
编辑好友列表
用户收藏管理
个人文件管理
论坛通行证设置
今日贴数图例
主题数图例
总帖数图例
在线图例
在线情况
用户组在线图例
文件集浏览
图片集浏览
Flash浏览
音乐集浏览
电影集浏览
贺卡发送
网上贸易 创造奇迹!
阿里巴巴
Alibaba
Copyright ©2000 - 2002
chinaonco
.net
Powered By
Dvbbs
Version 7.1.0 Sp1
页面执行时间 0.04688 秒, 4 次数据查询