h1 类型选择器 选择元素的一个类型
.className 类选择器 以class属性的值来选择元素,可以在一个页面中出现多个
#idName ID选择器 以id属性的值来选择元素,在页面中是唯一的,只能出现一次
article h2 后代选择器 选择指定祖先元素内的后代元素
article > h2 子元素选择器 选择指定父元素内的直接子元素
h2 ~ p 相邻兄弟选择器 选择第一个元素后的兄弟元素,两者拥有相同的父元素
h2 + p 子元素选择器 选择第一个元素后紧跟的元素,两者拥有相同的父元素
a[target] 目标属性选择器 选择一个存在某属性的元素
a[href="http://google.com/"] 属性均等选择器 选择一个属性值匹配特定值的元素
a[href*="login"] 属性包含选择器 选择一个属性值包含特定值的元素
a[href^="https://"] 属性开头选择器 选择一个属性值以特定值开头的元素
a[href$=".pdf"] 属性结尾选择器 选择一个属性值以特定值结尾的元素
a[rel~="tag"] 属性间隔选择器 选择一个属性值被空白分割成多个单词,且其中一个单词匹配给定值的元素
a[lang|="en"] 属性连接符选择器 选择一个属性值被连接符分割成多个单词,且其中一个单词匹配给定值的元素
a:link 链接(link)伪类 选择一个用户没有访问过的链接
a:visited 链接(link)伪类 选择一个用户访问过的链接
a:hover 行为性伪类 选择一个用户将鼠标指针悬浮在上方的元素
a:active 行为性伪类 选择一个用户使用中的元素
a:focus 行为性伪类 选择一个拥有用户焦点的元素
input:enabled 状态性伪类 选择一个处于可编辑状态(默认)下的元素
input:disabled 状态性伪类 选择一个通过设置disabled属性而处于不可编辑状态下的元素
input:checked 状态性伪类 选择一个被选中的单选或者复选按钮
input:indeterminate 状态性伪类 选择一个处于不确定状态下的单选或者复选按钮(可能被选中或者不被选中)
li:first-child 结构性伪类 选择父元素下的第一个子元素
li:last-child 结构性伪类 选择父元素下的最后一个子元素
div:only-child 结构性伪类 如果某个元素是它父元素中惟一的子元素,那么将会被匹配
p:first-of-type 结构性伪类 选择父元素中同类型的第1个子元素
p:last-of-type 结构性伪类 选择父元素中同类型的最后一个子元素
img:only-of-type 结构性伪类 若元素为父元素中同类型的唯一元素,则会被匹配
li:nth-child(2n+3) 结构性伪类 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,来计算所有元素
li:nth-last-child(3n+2) 结构性伪类 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,来计算所有元素
p:nth-of-type(3n) 结构性伪类 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,只计算文档树中给定类型的元素
p:nth-last-of-type(2n+1) 结构性伪类 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,只计算文档树中给定类型的元素
section:target 目标伪类 选择URI片段标示符的值指向的元素
div:empty 空伪类 选择没有任何子元素或者文本的元素
div:not(.awesome) 否定伪类 选择不匹配某个状态标示符的元素
.alpha:first-letter 文本伪元素 选择元素内文本的第一个字母
.bravo:first-line 文本伪元素 选择元素内文本的第一行
div:before 生成的内容 在被选择元素前创建伪元素
a:after 生成的内容 在被选择元素末尾创建伪元素
::selection 片段伪元素 选择通过用户操作所选定或者高亮的部分

CSS选择器列表的更多相关文章

  1. python 全栈开发,Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  2. js,jq,css选择器

    js获取节点: var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; / ...

  3. 细说CSS选择器

    众所周知,CSS的一个核心特征就是能向文档中的一组元素类型应用某些规则.每个规则都有两个基本部分:选择器(selector)和声明块(declaration block).下图显示了规则的各个部分. ...

  4. CSS 选择器(转)

    原文转自:http://www.cnblogs.com/xyzhanjiang/p/5447406.html CSS 选择器除了样式表匹配元素时需要用到,在使用 jQuery 等库的时候也可以利用 C ...

  5. 总结30个CSS选择器

    或许大家平时总是在用的选择器都是:#id  .class  以及标签选择器.可是这些还远远不够,为了在开发中更加得心应手,本文总结了30个CSS3选择器,希望对大家有所帮助. 1 *:通用选择器 * ...

  6. CSS选择器、CSS hack及CSS执行效率

    主要内容: 1.CSS选择器.优先级与匹配原理 2. CSS 引入的方式有哪些 ? link 和 @import 的区别是 ? 3.CSS hack 4.如何书高效CSS  一.CSS选择器.优先级与 ...

  7. 精通 CSS 选择器

    CSS 选择器除了样式表匹配元素时需要用到,在使用 jQuery 等库的时候也可以利用 CSS 选择器来选择元素,因此作为前端开发需要熟练掌握.下面是一些常用的 CSS 选择器示例. 元素选择器 E, ...

  8. HTML 学习笔记 CSS(选择器3)

    CSS 属性选择器 属性选择器可以根据元素的额属性以及属性值来选择元素 例子1 如果 你希望把包含title的所有元素变成红色 *[title] {color:red} 例子2 与上面类似 可以只对有 ...

  9. HTML 学习笔记 CSS(选择器)

    CSS元素选择器 最常见的CSS 选择器就是元素选择器 换句话说 文档的元素就是最基本的选择器 如果设置HTML样式 选择器通常就是某个HTML元素 比如p h1 em a 甚至可以是HTML本身 h ...

随机推荐

  1. oracle查询blob类型

    下午要查询一个数据,要求是从 表t_report 中查找出 mainbody字段中包含“hibernate”字符串的所有信息.而mainbody字段是blob类型.百度后终于找到答案: DBMS_LO ...

  2. HAOI 硬币购物

    试题描述: 现在一共有4种硬币,面值各不相同,分别为ci(i=1,2,3,4).某人去商店买东西,去了tot次,每次带di枚ci硬币,购买价值为si的货物.请问每次有多少种付款方法. 输入: 第一行包 ...

  3. YesFinder - 网页文件管理系统 V2.0

    2.0版增加了模态框并重写了右键菜单插件.界面改为全中文.使用方式更加灵活. 同时,文件及目录改名更方便,直接双击名称就可改名. 这是DEMO的效果图. 1.功能上的主要改进是可以双击改文件/目录名称 ...

  4. 调整cell的间距

    -(instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier ...

  5. 19个非常有用的 jQuery 图片滑动插件和教程

    jQuery 是一个非常优秀的 Javascript 框架,使用简单灵活,同时还有许多成熟的插件可供选择.其中,最令人印象深刻的应用之一就是对图片的处理,它可以让帮助你在你的项目中加入精美的效果.今天 ...

  6. ioctl函数,可以获取ip地址,修改ip地址,网卡地址等

    部分转自http://www.cnblogs.com/zht-blog/p/4025903.html #include <sys/types.h>#include <sys/sock ...

  7. 高性能web

    http://developer.51cto.com/art/201104/255619.htm http://developer.51cto.com/art/201104/254031.htm ht ...

  8. Moving Acerage

    http://zh.wikipedia.org/zh/%E7%A7%BB%E5%8B%95%E5%B9%B3%E5%9D%87

  9. 找出指定目录下,大于指定大小的文件(LINUX SHELL)

    当前目录下: find ./ -size +2048k |xargs du -b|awk '{print $1/1024/1024 "M" $2}'|sort -n ...... ...

  10. RAILS ON

    我是按照下面这个URL来轻快安装的. http://lxiaodao.iteye.com/blog/1579992 (1)RVM官方网站应该是改版过一次, 使用 curl -L https://get ...