CSS3 选择器用法小结
表单选择器:
/*: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 选择器用法小结的更多相关文章
- CSS3选择器用法小结
1.*通配符选择器 eg:*{margin:0;padding:0;} 2.#id选择符 ID选择器是CSS中效率最高的选择器,使用的时候要保证ID的唯一性 eg:#div{width:960px;m ...
- CSS3选择器使用小结
CSS3 选择器小结 一 通用选择器 1 *{}通配选择符(CSS2):适合所有元素对象. 2 E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3 E#myid是id ...
- 不可不看!CSS3中三十一种选择器用法
原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2012 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...
- 牢记 31 种 CSS 选择器用法
原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2011 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...
- CSS3选择器小结
CSS3 选择器小结 一 通用选择器 1 *{}通配选择符(CSS2):适合所有元素对象. 2 E类型(HTML)选择符(CSS1):以文档语言对象类型DOM作为选择符. 3 E#myid是id ...
- 1:CSS中一些@规则的用法小结 2: @media用法详解
第一篇文章:@用法小结 第二篇文章:@media用法 第一篇文章:@用法小结 这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下 at-rule ...
- css3 选择器(三)
接css3选择器(一) 接css3 选择器(二) 这篇和前两篇内容相关性不大,主要是涉及到一些css3的状态选择器,所以标题从一开始. 一.[:enabled]选择器 一看这个属性就知道是专为表单元素 ...
- CSS3 选择器——基本选择器
CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别, ...
- CSS3 选择器——伪类选择器
前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...
随机推荐
- python的字符串内建函数(方法)
原本总结一下,后来发现这个里面讲的很全,可以点进去参考:http://www.runoob.com/python/python-strings.html
- django第一课 简单的网页视图
注意本人django版本2.0 python3.6 第一步:创建自己的django项目 django-admin.py startproject ** 第二步:进入**创建app pytho ...
- java调用存储过程、存储函数
需要用到的接口 接口 CallableStatement JDK文档对改接口的说明: public interface CallableStatement extends PreparedStatem ...
- Java8-Guava实战示例
示例一: 跟示例三对比一下,尽量用示例三 List<InvoiceQueryBean> invoiceQueryBeanList = new ArrayList<>(); ...
- ES6-Iterator & for...of循环
依赖文件地址 :https://github.com/chanceLe/ES6-Basic-Syntax/tree/master/js <!DOCTYPE html> <html&g ...
- 机器学习中规范化项:L1和L2
规范化(Regularization) 机器学习中几乎都可以看到损失函数后面会添加一个额外项,常用的额外项一般有两种,一般英文称作ℓ1-norm和ℓ2-norm,中文称作L1正则化和L2正则化,或者L ...
- 全局描述符表(GDT)——《x86汇编语言:从实模式到保护模式》读书笔记09
在进入保护模式之前,我们先要学习一些基础知识.今天我们看一下全局描述符表(Global Descriptor Table, 简称GDT). 同实模式一样,在保护模式下,对内存的访问仍然使用段地址加偏移 ...
- centos6.5 + 7 静态ip配置
2017/09/19日更, centos6.5 可用 DEVICE=eth0 TYPE=Ethernet ONBOOT=yes NM_CONTROLLED=yes BOOTPROTO=static D ...
- unity游戏热更新总结
1.利用反射来做Dll更新 这种方式只支持windows以及安卓这种支持JIT的平台,对于IOS就不适用了,IOS这种Full-AOT的平台不支持生成新的代码,因此这种热更方式很少用到. 2.利用 ...
- Node.js之Express四
Express提供的大部分功能是通过中间件函数完成的,这些中间件函数在Node.js收到请求的时点和发送响应的时点之间执行.Express的Connect模块提供了中间件框架,可以方便的在全局或路径级 ...