下面我们做一个这样的链接:未被点击时超链接文字无下划线,显示为蓝色;当鼠标在链接上时有下划线,链接文字显示为红色;当点击链接后,链接无下划线,显示为绿色。
实现方法很简单,在源代码的<head>和<head>之间加上如下的CSS语法控制:
<style type="text/css">
<!--
a:link { text-decoration: none;color: blue}
a:active { text-decoration:blink}
a:hover { text-decoration:underline;color: red}
a:visited { text-decoration: none;color: green}
-->
</style>
其中:
a:link 指正常的未被访问过的链接;
a:active 指正在点的链接;
a:hover 指鼠标在链接上;
a:visited 指已经访问过的链接;
text-decoration是文字修饰效果的意思;
none参数表示超链接文字不显示下划线;
underline参数表示超链接的文字有下划线
-------------------------------------------------------------------------
演示:让网页中的链接去掉下划线
<style type="text/css">
<!--
A { text-decoration: none}
-->
</style>
将代码插入在<head></head>之间.<title>之前即可
-------------------------------------------------------------------------
使用CSS实现链接的虚线下划线\普通下划线效果
a {
color:#3399FF;
font-weight:Normal; /*CSS字体效果 普通 可以改成bold粗体 如果去除此行那么默认是不显示下划线的*/
text-decoration:none; /*CSS下划线效果:无下划线*/
}
a:hover {
color:#4499EE;
text-decoration:none; /*CSS下划线效果:无下划线*/
border-bottom: 1px #0099CC dotted /*CSS加一个只有下边的框 边框为虚线*/
}
a{ } :是用来控制连接的效果
a:hover{ }:是用来控制鼠标移上去的效果。
分享到:
相关推荐
7款CSS3鼠标滑过超链接时下划线动画展示特效是一款使用伪元素来制作超链接的下划线,并使用CSS3 animation来制作各种动画效果。
去掉html超链接下划线的CSS代码。三局简洁的css代码就能让超链接没有下划线。
这是一款js和CSS3鼠标悬停超链接展示图片特效。该特效中,当鼠标悬停到超链接上面时,会在超链接下面显示一张设定好的图片。该特效中提供了10种打开图片时的炫酷动画效果。
去掉超链接的下划线,需要用样式表CSS来控制,下面将举三个简单的实例来说明如何控制超链接的下划线,感兴趣的朋友可以参考下
css伪类 超链接 连接的用法 描述 link的样式说明
效果描述: 相信好多人经常碰到这样一个问题:客户要求去除新闻列表最后一行的下划线 怎么处理?相信之前很多懒人都是用js实现的... 使用方法: 1、将head中的样式引入到网页中(核心代码就在里面,你懂的)
css 浮雕式 超链接 简单实用 还好看呢
使用CSS样式美化超链接和鼠标指针PPT学习教案.pptx
CSS改变超链接属性 .doc
主要介绍了使用CSS去掉超链接的虚线边框的方法,即一般超链接用鼠标点击后留下的边框效果,有时变色其实即可达到标记的效果,需要的朋友可以参考下
7款CSS3鼠标滑过超链接动画特效是一款使用伪元素来制作超链接的下划线,并使用CSS3 animation来制作各种动画效果。
下面为大家展示一个实例:未被点击时超链接文字无下划线,显示为蓝色;当鼠标在链接上时有下划线,链接文字显示为红色;当点击链接后,链接无下划线,显示为绿色,感兴趣的朋友可有了解下哈
css 文字下划线 移动鼠标文字加粗 不带下划线的文档 仅供自己参考
css中关于超链接的四个属性一般正常顺序为:link,visited,hover,active,即: a:link 链接平常的状态 a:visited 链接被访问过之后 a:hover 鼠标放到链接上的时候 a:active 链接被按下的时候
jQuery+CSS实现淡入效果的超链接样式,代码简单,容易使用!
CSS定义下划线样式_莱茵河的小鱼_新浪博客.mht
普通的超链接效果是鼠标放上去出现一条下划线,本插件异想天开的使用html5 svg和css3打造出18种很神奇的超链接动画效果。每种超链接动画效果都有它的独到之处。
这是一款jQuery和CSS3鼠标悬停超链接文字动画特效。该特效共6种特效,分别是在鼠标HOVER或悬停在超链接文字上面时,超链接产生炫酷动画特效。
利用css3 transition属性制作的21种不同的鼠标悬停效果。当鼠标hover或悬停在超链接上时,会触发各种动画效果。每种动画效果都十分独特,可用于网站导航。