表单选择器:

/*: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. 杂记---Mongo的Invalid BSON field name $gte

    1.前言 这几天使用mongo的时候遇到了一个异常:Invalid BSON field name $gte,该问题可能会有很多小伙伴会遇到,因此记录一下解决过程.起因是用JAVA翻译一个其他语言写的 ...

  2. django第四课 标签的用法(if/else、for、ifequal、过滤器、注释等)

    if/else {% if %} <p>内容</P> {% endif %} {% else %}是可选标签 {% if %} <p>内容</P> {% ...

  3. Android六大基本布局

    一.基本理论Android六大基本布局分别是:线性布局LinearLayout.表格布局TableLayout.相对布局RelativeLayout.层布局FrameLayout.绝对布局Absolu ...

  4. 工具类APP

    应用名称 工具S 英文名称 未填写 应用描述 工具类APP 英文描述 未填写 应用官网 this 应用图标  

  5. C/C++ -- Gui编程 -- Qt库的使用 -- 对话框QDialog

    模态对话框 -----源文件main.cpp(工程QtDialog)----- #include "qtdialog.h" #include <QApplication> ...

  6. Global Embedding 理解

    1.Attention-based seq2seq e(t,i):求上一时刻的输出和这一时刻编码器的输出的相似度 a(t,i):求这个词在整个文本中占多大的比重,每个时刻都存在着一个值,这个只是求一个 ...

  7. stream was not readable.

    StreamWriter使用时的报错情况: stream was not readable. 错误原因: 没有指定StreamWriter的写入文件 正确代码示例1: byte[] businessD ...

  8. JBoss 实战(2)

    转自:https://www.cnblogs.com/aiwz/p/6154591.html JBOSS HTTP的Thread Group概念 JBOSS是一个企业级的J2EE APP Contai ...

  9. Start transaction not working with Revit 2014

    You're right, it's not being used correctly. The Transaction needs to take place inside the Idling e ...

  10. ABP学习入门系列(一)(第一个ABP项目)

    ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称.ASP.NET Boilerplate是一个用最佳实践和流行技术开发现代WEB应用程序的新起点,它 ...