CSS里的a:active 是干什么用的,请举例说明

html-css05

CSS里的a:active 是干什么用的,请举例说明,第1张

定义链接在鼠标被激活(点下去)时候的样式。操作方法如下:

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} /* 选定的链接 */