CSS新增的伪类选择器
:root 选择文档的根元素,等同于 html 元素
:empty 选择没有子元素的元素
:target 选取当前活动的目标元素
:not(selector) 选择除 selector 元素意外的元素
:enabled 选择可用的表单元素
:disabled 选择禁用的表单元素
:checked 选择被选中的表单元素
:after 在元素内部最前添加内容
:before 在元素内部最后添加内容
:nth-child(n) 匹配父元素下指定子元素,在所有子元素中排序第n
:nth-last-child(n) 匹配父元素下指定子元素,在所有子元素中排序第n,从后向前数
:nth-child(odd)
:nth-child(even)
:nth-child(3n+1)
:first-child 选择第一个子元素
:last-child 选择最后一个子元素
:only-child 匹配父元素下仅有的一个子元素
:nth-of-type(n) 匹配父元素下指定子元素,在同类子元素中排序第n
:nth-last-of-type(n) 匹配父元素下指定子元素,在同类子元素中排序第n,从后向前数
:nth-of-type(odd) 匹配同种标签中序数为奇数的元素
:nth-of-type(even) 匹配同种标签中序数为偶数的元素
:first-of-type 匹配父元素下使用同种标签的第一个子元素
:last-of-type 匹配父元素下使用同种标签的最后一个子元素
:only-of-type 匹配父元素下使用同种标签的唯一一个子元素
::selection 选择被用户选取的元素部分,用来改变浏览网页选中文本的默认效果(background和color有效)
:first-line 选择元素中的第一行
:first-letter 选择元素中的第一个字符
CSS新增的伪类选择器的更多相关文章
- CSS属性、伪类选择器,CSS3选择器
CSS1时IE6是部分支持,伟大的IE6!CSS2时IE6部分支持,伟大的IE6依旧是部分支持!CCS3盛行CSS4也已经提上日程的现在,IE6完全不支持.IE6你该走了,我们会永远记住你的功绩的!I ...
- CSS3新增的伪类选择器
伪类选择器的作用:对已有选择器做进一步的限制,对已有选择器能匹配的元素做进一步的过滤.CSS 3提供的伪类选择器主要分为以下三类: 结构性伪类选择器 UI元素状态伪类选择器 其他伪类选择器 1.结构性 ...
- CSS基础 结构伪类选择器 last-child、first-child和nth-of-type的使用方法
一.通过伪类选择器查找单个标签元素html结构 <div> <a herf='#'>导航1</a> <a herf='#'>导航2</a> ...
- CSS选择器之伪类选择器(元素)
:first-child 选择某个元素的第一个子元素(IE6不支持) :last-child 选择某个元素的最后一个子元素 :first-of-type [CSS3]选择一个上级元素下的第一个同类子元 ...
- CSS选择器之伪类选择器(伪元素)
selection [CSS4]应用于文档中被用户高亮的部分(比如使用鼠标或其他选择设备选中的部分).(IE8及以下不支持)(火狐-moz-selection) first-line 选择每个 < ...
- CSS选择器之伪类选择器(交互)
:link 选取未访问链接 :active 选取活动链接(单击某链接,未松开鼠标时). :visited 选取已被访问的链接. :target 链接指定的目标 :hover 当鼠标浮在元素上方时. : ...
- css 中的伪类选择器before 与after
.cf:after,.cf:before {content: " "; display: table;} .cf:after {clear: both;} :before是因为ta ...
- H5与CS3权威下.19 选择器(2)结构性伪类选择器
1.CSS中的伪类选择器及伪元素 (1)与自定义的class类选择器不同,伪类选择器是CSS中已经定义好的选择器. eg:a:link{color:#ff0000;} (2)伪元素的使用方法: 选择器 ...
- js进阶 10-8 伪类选择器有哪几类(自己不用,永远不是自己的)
js进阶 10-8 伪类选择器有哪几类(自己不用,永远不是自己的) 一.总结 一句话总结:自己不用,永远不是自己的. 0.学而不用,却是为何? 自己不用,永远不是自己的,有需求的时候要想到它,然后操作 ...
随机推荐
- js 设计模式——状态模式
状态模式 允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类. 简单的解释一下: 第一部分的意思是将状态封装成独立的类,并将请求委托给当前的状态对象,当对象的内部状态改变时,会带来 ...
- springboot中springAOP的使用
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring- ...
- Flink的TaskManager启动(源码分析)
通过启动脚本已经找到了TaskManager 的启动类org.apache.flink.runtime.taskexecutor.TaskManagerRunner 来看一下它的main方法中 最后被 ...
- nodeJS 中mongoose操作分页
开始前先聊聊五毛钱的: 好久没写了,可能是因为懒(哎),写这个是好事,既帮助了自己,巩固一下知识,也可以让别人给自己纠错纠错,三月份接触到了node,先是跟着一些教程写了一些小实例,感觉自己就喜欢上了 ...
- Scala 系列(二)—— 基本数据类型和运算符
一.数据类型 1.1 类型支持 Scala 拥有下表所示的数据类型,其中 Byte.Short.Int.Long 和 Char 类型统称为整数类型,整数类型加上 Float 和 Double 统称为数 ...
- Python从入门到精通之环境搭建
本章内容: Windows系统环境搭建 Linux系统环境搭建 Mac OS系统环境搭建 一.下载python安装包 下载地址:https://www.python.org/downloads/ 二. ...
- 第10章 文档对象模型DOM 10.3 Element类型
Element 类型用于表现 XML或 HTML元素,提供了对元素标签名.子节点及特性的访问. 要访问元素的标签名,可以使用 nodeName 属性,也可以使用 tagName 属性:这两个属性会返回 ...
- Linux中mysql5.7主从配置
MySQL主从配置(两台Linux之间) 简介 Linux下MySQL数据库的主从同步用来实现读写分离.主数据库进行数据的插入,删除与更新:从数据库专门用来查询操作,缓解数据库的压力.让运行海量数据的 ...
- 刚当上IT项目经理应该做些什么?
- POJ-2155-Matrix二位树状数组应用
题目: 一个只有0和1构成的二维平面,给你两种指令,一种是区间的更新,即0变为1,1变为0:一种是查询一个点是1还是0: 由于是二进制,所以每次更新在相应的点上加一,最后对2取余即可. 至于二维的树状 ...