CSS选择器列表

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	片段伪元素	选择通过用户操作所选定或者高亮的部分

 

转载于:https://www.cnblogs.com/zhanghuiming/p/5037904.html