定义链接在鼠标被激活(点下去)时候的样式。操作方法如下:
1、新建一个html文件,命名为test.html,a标签四个不同的伪类,有不同的效果。
2、利用a标签伪类改变字体的颜色。下面代码实现了a标签的默认颜色为红色,点击链接过后,颜色变为绿色,当鼠标放在连接上显示粉红色。
3、利用a标签伪类改变字体的大小。下面代码实现了a标签的默认大小为20px,点击链接过后,大小变为40px。
4、利用a标签伪类改变链接的背景颜色。下面代码实现了a标签的默认背景颜色为红色,点击链接过后,背景颜色变为绿色。
5、利用a标签伪类改变链接的字体。下面代码实现了a标签的默认字体为Monospace,点击链接过后,字体变为Arial。
6、最后利用a标签伪类去掉连接默认的下划线。下面代码实现了a标签在任何状态下都没有下划线。
a标签原始的状态,鼠标移上去的状态,被点击的状态,都设置一种字体颜色
a,a:hover,a:active{
color:#000
}
a:hover:鼠标处于鼠标悬停状态的链接样式
a:active:当鼠标左键按下时,被激活(就是鼠标按下去那一瞬间)的链接样式。
扩展资料:
a:visited:定义已访问过链接的样式;
a:link:定义正常链接的样式,未访问链接。
四个“状态”的先后过程是:a:link ->a:hover ->a:active ->a:visited。
去掉<a>的下划线:
对超链接下划线设置:使用代码"text-decoration"。
语法:
text-decoration : none || underline || blink || overline || line-through
text-decoration参数:
none : 无装饰;
blink : 闪烁;
underline : 下划线;
line-through : 贯穿线;
overline : 上划线。
去掉下划线的方法就是将其text-decoration设置为none即可。
a标签是有不同的伪类的,就是激活、访问过的和路过都不同的,你要把它们全部设好颜色。a:link {color:green} /* 未访问的链接 */
a:visited {color:green} /* 已访问的链接 */
a:hover {color: green} /* 鼠标移动到链接上 */
a:active {color: green} /* 选定的链接 */