基本选择器
通配选择器
选择器:*
类型:通配选择器
含义:选择文档中所有的HTML元素
元素选择器
选择器:E
类型:元素选择器
含义:选择指定类型的HTML元素
ID选择器
选择器:#ID
类型:ID选择器
含义:选择指定ID属性值为“ID”的HTML元素
类选择器
选择器:.class
类型:类选择器
含义:选择指定class属性值为“class”的HTML元素
群组选择器
选择器:.selctor1,selector2,...selectorN
类型:群组选择器
含义:将每一个选择器匹配的元素合并到一起
层次选择器
后代选择器
选择器:E F
类型:层次选择器
含义:匹配所有属于E元素后代的F元素
子选择器
选择器:E > F
类型:子选择器
含义:匹配所有E元素的子元素F
相邻兄弟选择器
选择器:E + F
类型:相邻兄弟选择器
含义:匹配所有相邻E元素之后的同级元素F
通用选择器
选择器:E ~ F
类型:通用选择器
含义:匹配E元素后的所有符合条件的兄弟元素,不单单是紧邻的兄弟元素。
伪类选择器
E:link链接伪类选择器
选择器:E:link
含义:匹配所有未被点击的链接。
E:visited链接伪类选择器
选择器:E:visited
含义:匹配所有已被点击的链接。
E:active用户行为伪类选择器
选择器:E:active
含义:匹配鼠标已经其上按下、还没有释放的E元素,常用于锚点和按钮上。
E:hover用户行为伪类选择器 ()
选择器:E:hover
含义:匹配鼠标悬停其上的E元素。
E:focus用户行为伪类选择器
选择器:E:focus
含义:匹配获得当前焦点的E元素。
E:target目标伪类选择器
E:lang(en)语言伪类选择器
E:checked选中状态伪类选择器
选择器:E:checked
含义:匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)。
示例:http://css.doyoe.com/selectors/pseudo-classes/checked.htm
E:enabled启用状态选择器
E:disabled不可用状态伪类选择器
E:not(s)否定伪类选择器
E:root文档的根元素伪类选择器
E:first-child伪类选择器
E:last-child伪类选择器
E:only-child伪类选择器
E:nth-child(n)伪类选择器
E:nth-last-child(n)伪类选择器
E:first-of-type伪类选择器
E:last-of-type伪类选择器
E:only-of-type伪类选择器
E:nth-of-type(n)伪类选择器
E:nth-last-of-type(n)伪类选择器
E:empty伪类选择器
伪元素选择器
E:first-letter | E::first-letter选择器
E:first-line | E::first-line选择器
E:before | E::before选择器
E:after | E::after选择器
选择器:E:after | E::after
含义:设置在对象后(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用,并且必须定义content属性。
示例:http://css.doyoe.com/selectors/pseudo-element/after.htm
E::placeholder选择器
E::selection选择器
属性选择器
E[attr]属性选择器
E[att="val"]属性选择器
E[att~="val"]属性选择器
选择器:E[att~="val"]
含义:选择具有att属性且属性值为一用空格分隔的字词列表,其中一个等于val的E元素。
示例:http://css.doyoe.com/selectors/attribute/att3.htm
E[att^="val"]属性选择器
选择器:E[att^="val"]
含义:选择具有att属性且属性值为以val开头的字符串的E元素。
示例:http://css.doyoe.com/selectors/attribute/att4.htm
E[att$="val"]属性选择器
选择器:E[att$="val"]
含义:选择具有att属性且属性值为以val结尾的字符串的E元素。
示例:http://css.doyoe.com/selectors/attribute/att5.htm
E[att*="val"]属性选择器
选择器:E[att*="val"]
含义:选择具有att属性且属性值为包含val的字符串的E元素。
示例:http://css.doyoe.com/selectors/attribute/att6.htm
E[att|="val"]属性选择器
选择器:E[att|="val"]
含义:选择具有att属性且属性值为以val开头并用连接符"-"分隔的字符串的E元素,如果属性值仅为val,也将被选择。
示例:http://css.doyoe.com/selectors/attribute/att7.htm
参考链接: