伪类样式

描述

通常情况,超级链接上设置的样式,称为伪类

作用

设置超级链接的4种状态

示例

a:link{
    font-weight:bold;
    text-decoration:none;
    color:red;
}

小贴士

1、伪类是用在超链接上的效果比较多,但超链接不是伪类。

2、伪类是选择器。

表格1.1伪类选择器

序号 属性 作用
1 a:link 未访问的链接
2 a:visited 已访问的链接
3 a:hover 鼠标移动到链接上(浮动、悬停)
4 a:active 向被激活的元素添加样式
5 :focus 选择拥有键盘输入焦点的元素

CSS 伪类(Pseudo-classes)是用来添加一些选择器的特殊效果。
伪类的语法:
selector:pseudo-class {property:value;}
CSS类也可以使用伪类:
selector.class:pseudo-class {property:value;}

:link向未访问的链接添加特殊的样式。例如,选择未访问链接样式:
a:link { background-color:yellow;}

:visited向访问过的链接添加特殊的样式。例如:
a:visited { background-color:blue;}

:hover在鼠标移到链接上时添加的特殊样式。
提示: :hover 选择器器可用于所有元素,不仅是链接。
例如:a:hover {color: red;}

:active向活动的链接添加特殊的样式。当点击一个链接时它就会变成活动链接。例如:a:active {background-color:green;}
注意: 为了让那些运用在超链接的伪类产生预期的效果,在CSS定义中,:link 、 :visited 、:hover 、 :active
必须严格按照以上顺序排列,否则不起作用。

:focus选择器用于选择具有焦点的元素,:focus选择器接受键盘事件或其他用户输入的元素。
一个输入字段获得焦点时选择的样式:
input:focus {background-color:yellow;}

 

人已赞赏
CSS笔记

列表样式

2020-2-4 11:09:05

CSS笔记

伪类的分类

2020-2-4 12:02:42

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
有新消息 消息中心
搜索