CSS语法来控制超链接的形式、颜色变化
2009-11-06 14:06
281 查看
我们可以用CSS语法来控制超链接的形式、颜色变化。 下面我们做一个这样的链接:未被点击时超链接文字无下划线,显示为蓝色;当鼠标在链接上时有下划线,链接文字显示为红色;当点击链接后,链接无下划线,显示为绿色。 实现方法很简单,在源代码的<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参数表示超链接的文字有下划线 下面这行文字就是我们刚才做的效果。 效果演示 同样,如果讲none替换成overline则给超链接文字加上划线,换成line-through给超链接文字加上删除线,blink则使文字在闪烁。 让网页中的链接去掉下划线 <style type="text/css"> <!-- A { text-decoration: none} --> </style> 将代码插入在<head></head>之间.<title>之前即可 CSS实现链接的虚线/下划线效果 003CSS实现链接的虚线/下划线效果 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{}控制鼠标移上去的效果。 |
相关文章推荐
- Table之CSS控制Table内外边框,颜色,大小,样式变化更简单
- css的伪类的超链接的颜色变化处理
- 控制鼠标移动时的颜色变化
- CSS中的无序排列转为超链接的形式
- 在css中控制超链接target=_blank
- CSS超链接样式常见四种状态控制
- 单片机+手机APP蓝牙控制RGB灯的颜色变化 程序与pcb
- css控制颜色
- CSS四:背景、列表、超链接伪类、鼠标形状控制属性
- inut按钮hover时变化的css控制方法
- inut按钮hover时变化的css控制代码
- 用css控制表格的交替颜色
- css 控制滚动条的颜色
- 用CSS控制li标记样式的语法介绍
- OC简单小功能的实现-利用三个代表三原色的滑块控制背景颜色变化
- CSS控制Table内外边框、颜色、大小示例
- 利用CSS控制表格的交替颜色
- CSS控制Table内外边框、颜色、大小示例
- CSS超链接样式常见四种状态控制
- 如何用CSS控制超链接字体样式