码迷,mamicode.com
首页 > 其他好文 > 详细

粗谈伪类选择器

时间:2019-11-10 17:34:43      阅读:78      评论:0      收藏:0      [点我收藏+]

标签:标签   鼠标   site   状态   伪类   一个   第一个   选择   添加   

伪类选择器是添加到选择器的关键字,用于指定要选择的元素的特殊状态。以:单冒号开始。分为动态伪类选择器、结构伪类选择器、否定伪类选择器。

动态伪类选择器:

:link{ }【元素未访问时的状态】

:visited{ }【元素已访问后的装态】

:focus{ }【被选中时会发生的装态】

:hover{ }【鼠标悬停在元素时的会发生的状态】

:active{ }【鼠标点击时元素发生的状态】

注:该顺序不能改变,link和visited为静态伪类选择器,可不分先后顺序

结构伪类选择器:用于选中某个元素

1、

:first-child  选中第一个元素

:last-child  最后一个元素

:nth-child(n)  选中第n个元素

示例:section>p:nth-child(3)表示:section下的第3个元素,如果是p则选中

2、选中同元素名相同标签的第几个元素

:nth-of-type(n)

示例:section>p:nth-of-type(3)  表示:选中section下的第3个p

3、选中倒数第n个元素

:nth-last-child(n)

否定伪类选择器

格式:   :not()  除了某个元素,其他添加样式

示例:section>p:not(:nth-child(3))  除了第3个p其他添加样式

格式:除了某几个元素,其他添加样式

:not(  ):not()

 

粗谈伪类选择器

标签:标签   鼠标   site   状态   伪类   一个   第一个   选择   添加   

原文地址:https://www.cnblogs.com/freeland/p/11830855.html

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