表单选择器:

/*:enabled 可用的 :disabled 被禁用的 :focus 获取了焦点的
多用在表单元素上*/
input:enabled {...}
input:disabled {...}
input:focus {...}

属性选择器:

/*[attribute] [attribute=value] 选择具有对应属性的元素
即使此属性没有实际作用*/
a[target] {...}
a[target=_blank] {...}

次序选择器:

:first-child 选取属于其父元素的首个子元素
:last-child 选取属于其父元素的最后一个子元素
:nth-child(n) 选取父元素的第n个子元素
:nth-last-child(n) 倒序选取父元素的第n个子元素

/*计算次序时不考虑类型,但如果符合次序的元素跟选择器的类型不匹配,则不会被选取*/
ul li:first-child {...}
p:nth-child(odd) {...}
p:nth-child(even) {...}
p:nth-last-child(2) {...}

:first-of-type 父元素的特定类型的首个子元素的每个元素
:last-of-type 父元素的特定类型的首个子元素的每个元素
:nth-of-type(n) 父元素的特定类型的第n个子元素
:nth-last-of-type(n) 父元素的特定类型的第n个子元素的每个元素,从最后一个子元素开始计数

/*只对类型匹配的元素进行次序计算*/
ul li:first-of-type {...}
p:last-of-type {...}
p:nth-of-type(2) {...}

CSS3 选择器用法小结的更多相关文章

  1. CSS3选择器用法小结

    1.*通配符选择器 eg:*{margin:0;padding:0;} 2.#id选择符 ID选择器是CSS中效率最高的选择器,使用的时候要保证ID的唯一性 eg:#div{width:960px;m ...

  2. CSS3选择器使用小结

    CSS3 选择器小结 一 通用选择器 1  *{}通配选择符(CSS2):适合所有元素对象. 2  E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3  E#myid是id ...

  3. 不可不看!CSS3中三十一种选择器用法

    原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2012 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...

  4. 牢记 31 种 CSS 选择器用法

    原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2011 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...

  5. CSS3选择器小结

    CSS3 选择器小结 一 通用选择器 1  *{}通配选择符(CSS2):适合所有元素对象. 2  E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3  E#myid是id ...

  6. 1:CSS中一些@规则的用法小结 2: @media用法详解

    第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下     at-rule ...

  7. css3 选择器(三)

    接css3选择器(一) 接css3 选择器(二) 这篇和前两篇内容相关性不大,主要是涉及到一些css3的状态选择器,所以标题从一开始. 一.[:enabled]选择器 一看这个属性就知道是专为表单元素 ...

  8. CSS3 选择器——基本选择器

    CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别, ...

  9. CSS3 选择器——伪类选择器

    前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...

随机推荐

  1. js delete删除对象属性,delete删除不了变量及原型链中的变量

    js delete删除对象属性,delete删除不了变量及原型链中的变量 一.delete删除对象属性 function fun(){ this.name = 'gg'; } var obj = ne ...

  2. Backing Up and Restoring HBase Data

    There are two strategies for backing up HBase:1> Backing it up with a full cluster shutdown2> ...

  3. Netty核心概念(10)之内存管理

    1.前言 之前的章节已经将启动demo中能看见的内容都分析完了,Netty的一个整体样貌都在第8节线程模型最后给的图画出来了.这些内容解释了Netty为什么是一个异步事件驱动的程序,也解释了Netty ...

  4. Java学习之路(十):异常

    ---恢复内容开始--- 异常的概述和分类 Throwable类是Java语言中所有错误或者异常的超类(也就是说,Java中所有的报错都是继承与Throwable的),也只有当对象是此类或者此类的子类 ...

  5. 2018春招-美团后台开发方向编程题 (python实现)

    第一题:字符串距离 题目: 给出两个相同长度的由字符 a 和 b 构成的字符串,定义它们的距离为对应位置不同的字符的数量.如串”aab”与串”aba”的距离为 2:串”ba”与串”aa”的距离为 1: ...

  6. 网络游戏程序员须知 UDP vs TCP(转)

    本文为作者原创或翻译,转载请注明,不得用于商业用途. 作者:rellikt@gmail.com 首发链接:http://blog.csdn.net/rellikt/archive/2010/08/21 ...

  7. java文件上传-使用apache-fileupload组件

    目前文件上传的(框架)组件:Apache----fileupload .Orialiy – COS – 2008() .Jsp-smart-upload – 200M. 用fileupload上传文件 ...

  8. ES6-Set and Map

    依赖文件地址 :https://github.com/chanceLe/ES6-Basic-Syntax/tree/master/js <!DOCTYPE html> <html&g ...

  9. java-双大括号实例初始化的反模式

    今天在看springboot的batch时, 看到这样一段代码, 直接把我看懵了, 于是找了一下, 发现这 两个大括号 {{  叫实例初始化器 FlatFileItemReader<Person ...

  10. Hadoop MapReduce流程及容错

    shuffle流程 输入分片(input split):在进行map计算之前,mapreduce会根据输入文件计算输入分片(input split),每个输入分片(input split)针对一个ma ...