定义链接在鼠标被激活(点下去)时候的样式。操作方法如下:
1、新建一个html文件,命名为test.html,a标签四个不同的伪类,有不同的效果。
2、利用a标签伪类改变字体的颜色。下面代码实现了a标签的默认颜色为红色,点击链接过后,颜色变为绿色,当鼠标放在连接上显示粉红色。
3、利用a标签伪类改变字体的大小。下面代码实现了a标签的默认大小为20px,点击链接过后,大小变为40px。
4、利用a标签伪类改变链接的背景颜色。下面代码实现了a标签的默认背景颜色为红色,点击链接过后,背景颜色变为绿色。
5、利用a标签伪类改变链接的字体。下面代码实现了a标签的默认字体为Monospace,点击链接过后,字体变为Arial。
6、最后利用a标签伪类去掉连接默认的下划线。下面代码实现了a标签在任何状态下都没有下划线。
linkvisitedhoveractive解释及正确顺序:
a:link 选择器设置指向普通的、未被访问页面的链接的样式
a:visited 选择器用于设置指向已被访问的页面的链接
a:active 选择器用于活动链接
a:hover 选择器用于选择鼠标指针浮动在上面的元素。
text-decoration 属性大多用于去掉链接中的下划线:
例如:a:link{text-decoration:none}看到别人总结的两点参考下记忆:
在CSS中,如果对于相同元素有针对不同条件的定义,宜将最一般的条件放在最上面,并依次向下,保证最下面的是最特殊的条件。
“爱恨原则”(LoVe/HAte),即四种伪类的首字母:LVHA。
再重复一遍正确的顺序:a:link、a:visited、a:hover、a:active
扩展资料:css链接link时,链接可以使用任何css属性,包括字体.颜色.背景等等. 链接有四个状态,可在四个状态时设置不同的属性 a:link - 正常,未访问过的链接 a:visited - 用户已访问过的链接 a:hover -
当用户鼠标放在链接上时 a:active - 链接被点击的那一刻 当为链接的不同状态设置样式时,需要遵循a:hover 必须位于a:link 和a:visited之后,a:active 必须位于 a:hover 之后。
:active选择器用于选择活动链接。
当在一个链接上点击时,它就会成为活动的激活的。
:active选择器适用于所有元素,不仅限于链接a元素。
:focus,:focus 选择器用于选取获得焦点的元素。
仅接收键盘事件或其他用户输入的元素允许 :focus 选择器。
a{display:block,width:60px,height:40px,把每个导航超链接a标签都设置成块儿,设置好尺寸,具体根据图片的尺寸。
不做成块儿,就无法设置宽高,也就看不到你设置的背景图片。
a:hover{background:url(images/bg_2.jpg)}举例的这个bg_2.jpg就是鼠标放上去之后先是的背景图片。