常用 CSS 选择器
// css 读取顺序从右到左,符合要求的都会匹配
// 通配符选择器 -- 选择所有元素
*
// 通配符选择器 -- 选择某个元素下的所有元素
.demo *
// 元素选择器
html,body,p,div等等
// 类选择器 -- 使用类选择器之前需要在html元素上定义类名
.className
// 类选择器还可以结合元素选择器 -- 匹配类同时匹配元素
p.items
// 多类选择器 -- 注意,有一个不存在将无法找到该元素 -- ie6不支持
.important.items
// id 选择器 -- 1.全局唯一 2.一个元素只能命名一个id
#id
// 后代选择器 -- 选择E元素的后代元素F(不管儿子还是孙子)
E F
// 子元素选择器 -- ie6不支持
E > F
// 相邻兄弟元素选择器 -- 同级目录且 E 后边紧邻的 F(不含 E)
E + F
// 通用兄弟选择器 -- CSS3增加,同级目录下 E 后边所有 F(不含 E) -- ie6不支持
E ~ F
// 群组选择器(逗号隔开不同规则)
.first, .last
// 所有父元素下第一个元素(以 body 作为根父节点)
:first-child
// 父元素下第一个且为 p 的元素
p:first-child
// 父元素下第二个且为 p 的元素
p:nth-child(2)
// 同上,从最后一个子元素开始计数
p:nth-last-child(2)
// 父元素最后一个且为 p 的元素
p:last-child
// 父元素下第二个 p 元素
p:nth-of-type(2)
// 同上,但是从最后一个子元素开始计数
p:nth-last-of-type(2)
// 父元素最后一个 p 元素
p:last-of-type
// 与子元素选择器组合 -- 只匹配 E 元素子目录下且最后位置为 p 的元素
E > p:last-child
// 与后代选择器组合 -- 匹配 E 元素子目录、子子目录里且最后位置为 p 的元素
E p:last-child
// 选择其 src 属性值以 "https" 开头的每个 <a> 元素
a[src^="https"]
// 选择其 src 属性以 ".pdf" 结尾的所有 <a> 元素
a[src$=".pdf"]
// 选择其 src 属性中包含 "abc" 子串的每个 <a> 元素
a[src*="abc"]
参考:
http://www.w3school.com.cn/cssref/css_selectors.ASP
http://www.w3cplus.com/css3/basic-selectors
https://www.zybuluo.com/Rico/note/19592
http://blog.jayself.com/2014/04/26/css3_selectors/
常用 CSS 选择器的更多相关文章
- 30个最常用css选择器解析(zz)
你也许已经掌握了id.class.后台选择器这些基本的css选择器.但这远远不是css的全部.下面向大家系统的解析css中30个最常用的选择器,包括我们最头痛的浏览器兼容性问题.掌握了它们,才能真正领 ...
- 30个最常用css选择器解析
转自:http://www.cnblogs.com/yiyuanke/archive/2011/10/22/CSS.html 你也许已经掌握了id.class.后台选择器这些基本的css选择器.但这远 ...
- 常用css选择器以及选择器的权重值介绍
一.选择器的权重值 选择器权重值比较: !important infinity 无穷大 行间样式 1000 id ...
- 兼容IE8及以上的常用css选择器
p~ul//位于p元素后边的ul div>p div+p//紧接在 <div> 元素之后的所有 <p> 元素 [attribute]//[target]选择带有 targ ...
- css选择器
常用css选择器,希望对大家有所帮助,不喜勿喷. 1.*:通用选择器 * { margin: 0; padding: 0; } 选择页面上的全部元素,通常用于清除浏览器默认样式,不推荐使用. 2.#i ...
- XPath语法和CSS选择器介绍
XPath语法 XPath 是一门在 XML 文档中查找信息的语言.XPath 可用来在 XML 文档中对元素和属性进行遍历.XPath 是 W3C XSLT 标准的主要元素,并且 XQuery 和 ...
- selenium元素定位之css选择器
在selenium元素定位时会用到css选择器选取元素,虽说xpath在定位元素时能解决大部分问题,但使用css选择器选取元素也是一种不错的选择. css相较与xpath选择元素优点如下: 表达式更加 ...
- CSS选择器命名及常用命名
CSS选择器命名及常用命名 CSS选择器命名及常用命名 规范的命名也是Web标准中的重要一项,标准的命名可以使代码更加易读,而且利于搜索引擎搜索,比如定义了两个div,一个 id 命名为“div1”, ...
- css3种引入方式,样式与长度颜色,常用样式,css选择器
# CSS三种引入方式 ## 一.三种方式的书写规范 #### 1.行间式 ```html<div style="width: 100px; height: 100px; backgr ...
随机推荐
- Java中indexof()的使用
Java中字符串中子串的查找共有四种方法(indexof()) indexOf 方法返回一个整数值,指出 String 对象内子字符串的开始位置.如果没有找到子字符串,则返回-1. 如果 starti ...
- python爬虫08 | 你的第二个爬虫,要过年了,爬取豆瓣最受欢迎的250部电影慢慢看
马上就要过年啦 过年在家干啥咧 准备好被七大姑八大姨轮番「轰炸」了没? 你的内心 os 是这样的 但实际上你是这样的 应付完之后 闲暇时刻不妨看看电影 接下来咱们就来爬取豆瓣上评分最高的 250部电影 ...
- Ajax json 数据格式
ajax : 是么是同步 什么事异步 同步现象:客户端发送请求到服务端,当服务端返回响应之前,客户端都处于等待卡死状态. 异步现象:客户端发送请求到服务器端,无论服务器是否返回,客户端都可以随意做其他 ...
- ionic3中使用自定义配置
新工作接触了ionic,以前没用过,只是离职前短暂接触过类似的vuex,到需要修改公司项目的时候临时差什么学什么,其中一个是自定义配置项 配置是很常见的设置,之前用的thinkphp的配置很清晰,基本 ...
- Spark MLlib之线性回归源代码分析
1.理论基础 线性回归(Linear Regression)问题属于监督学习(Supervised Learning)范畴,又称分类(Classification)或归纳学习(Inductive Le ...
- 为什么pthread_cond_wait须要传递mutex參数
这是来自知乎的一个问题,由@吴志强提出,有意思的是,他看了大家的回答后,突然顿悟了,同一时候也发现有人答错了,于是乎.他自己回答了自己的问题. 我看完后.发现他分析的非常精彩,于是就记录在这.以下是他 ...
- Linux 3.14 待机流程分析
1:待机节点创建 static int __init pm_init(void) { int error = pm_start_workqueue(); if (error) return error ...
- oc4--方法
// main.m // 第一个OC类-方法2 #import <Foundation/Foundation.h> // 1.编写类的声明 @interface Iphone : NSOb ...
- Linux安装sshfs挂载远程目录到本地及卸载
挂载远程目录的方式很多,这里把sshfs记录一下备忘.Linux用sshfs挂载远程目录到本地 安装sshfs 在Ubuntu下,只需要使用 $ sudo apt-get install sshfs ...
- <T extends Serializable>这是什么意思呢?看明白这个,你的问题就自然而然的明白了!
1.转自:https://blog.csdn.net/liwenqiang758/article/details/8131185 自己动手丰衣足食!!! 泛型是Java SE 1.5的新特性,泛型的本 ...