码迷,mamicode.com
首页 > Web开发 > 详细

css总结12:CSS 伪类(Pseudo-classes)

时间:2018-03-26 00:42:05      阅读:210      评论:0      收藏:0      [点我收藏+]

标签:classes   区分大小写   res   oob   大小   访问   type   tags   匹配   

1 伪类作用:CSS伪类是用来添加一些选择器的特殊效果。

2 常用示例:

2.1anchor伪类:代码:

  正常语法:

a{color:#FF0000;}/* 文字颜色 */

  伪类语法:

a:link {color:#FF0000;} /* 未访问的链接 */

a:visited {color:#00FF00;} /* 已访问的链接 */

a:hover {color:#FF00FF;} /* 鼠标划过链接 */

a:active {color:#0000FF;} /* 已选中的链接 */

注:在CSS定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。 在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。伪类的名称不区分大小写。

2,2 CSS - :first - child伪类

 

您可以使用 :first-child 伪类来选择元素的第一个子元素

 

注意:在IE8的之前版本必须声明<!DOCTYPE> ,这样 :first-child 才能生效

例1:匹配第一个 <p> 元素:p标签的第一个标签内容变蓝。

p:first-child {

color:blue;

}

例2:p标签内的子标签i内的第一个标签i内的文字变蓝

p > i:first-child{

color:blue;

}

 

 

css总结12:CSS 伪类(Pseudo-classes)

标签:classes   区分大小写   res   oob   大小   访问   type   tags   匹配   

原文地址:https://www.cnblogs.com/autoXingJY/p/8647470.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!