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选择 ...
随机推荐
- Swift循环遍历集合方法
第一种方式:for-in循环 OC延续了C语言的for循环,在Swift中被彻底改造,我们无法再使用传统形式的for循环了 遍历数组和字典: //遍历数组 let iosArray = [&quo ...
- (转)Mysql备份还原数据库之mysqldump实例及参数详细说明
http://www.xuejiehome.com/blfl-2.html http://www.cnblogs.com/xuejie/archive/2013/01/11/2856911.html ...
- 【Git】学习记录
配置git git config --global user.name "用户名或者用户ID" git config --global user.email "邮箱&qu ...
- Android 开发工具类 04_KeyBoardUtils
打开或关闭软键盘: 1.打卡软键盘: 2.关闭软键盘. import android.content.Context; import android.view.inputmethod.InputMet ...
- OpenGL12-shader(GLSL)着色语言2-(参数传递)(代码以上传)
上一篇中介绍了如何使用shader,用来一个最简单的shader,计算顶点的位置,调用了 OpenGL 顶点着色语言中的内置变量对顶点进行操作,这一例程中,将展示如何将应用层 的数据传递到shader ...
- printf()的转换说明的修饰符中的标记、数字、和.数字
先记下代码和运行结果 再解释 #include <stdio.h> #include <stdlib.h> #include <limits.h> #define ...
- C++调用C代码的两种方式
由于C++支持函数重载,在编译函数代码的时候会加上参数类型的信息,而C编译只有函数名信息,导致C++直接调用C代码在链接的时候会出现函数未定义的问题.解决这种问题有两种方法.方法一:在写C代码的时候考 ...
- Nodejs学习笔记(八)—Node.js + Express 实现上传文件功能(felixge/node-formidable)
前言 前面讲了一个构建网站的示例,这次在此基础上再说说web的常规功能----文件上传,示例以一个上传图片的功能为例子 上传功能命名用formidable实现,示例很简单! PS:最近比较忙,距上一次 ...
- 【转】CSS3的calc()使用——精缩版
问题:在制作页面的时候,总会碰到有的元素是100%的宽度.如果元素宽度是100%时,只要在元素中添加了border,padding,margin任何一值,都将会把元素盒子撑破(标准模式下,除IE怪异模 ...
- Java原子性、可见性、内存模型
原子性: 原子性就是指该操作是不可再分的.不论是多核还是单核,具有原子性的量,同一时刻只能有一个线程来对它进行操作.简而言之,在整个操作过程中不会被线程调度器中断的操作,都可认为是原子性.比如 a = ...