css-选择器大汇总

1、*（清空选择器 / 通用选择符）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

2、#X（ID选择器）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

3、.X（类选择器）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

4、X Y（后代/descendant选择器）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

5、X：：（标签/类型选择器）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

6、X:visited、X:link（伪类选择器）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

7、X+Y（相邻选择器）（直接后继元素）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

8、X>Y（子代选择器）（直接子元素）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

9、X~Y（普通相邻选择器）（后继所有的兄弟元素）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

10、X[title]（属性选择器）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

11、X[href="foo"]：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

12、X[href*="foo"]（指向属性值里包含有foo的元素，如：foo.com或com.foo或stu.foo.dl）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

13、X[href^="href"]（指向属性值开头就包含的字符串，如：a[href^="http"]）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

14、X[href$="href"]（指向属性值结尾就包含的字符串，如：a[href^=".jpg"]）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

15、X[data-*="foo"]：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

16、X[foo~="bar"]（`~`符号可以定位那些某属性值是空格分隔多值的标签）：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

17、X:checked（定位那些被选中的单选框和多选框）：：兼容性----IE9+、Firefox、Chrome、Safari、Opera

18、X:after（X之后添加内容或样式）（当overflow：hidden方法无用时，可使用这个办法，另外样式里可添加clear：both；避免对之后的元素造成影响，必定记住这是个好办法！！！根据CSS3标准，可以用两个冒号::）：：兼容性----IE8+、Firefox、Chrome、Safari、Opera

19、X：hover（鼠标滑过起作用，另外旧版本里只有a标签有hover作用）：：兼容性----IE6+（IE6只能在锚点标签上起作用）、Firefox、Chrome、Safari、Opera

20、X:not(selector)（取反伪类）（把id为‘container’之外的所有p标签都选中，如：p：not（#container）

）：：兼容性----IE9+、Firefox、Chrome、Safari、Opera

21、X::pseudoElement（我们可以使用`::`来选中某标签的部分内容，如第一段、第一行、第一个字，如：p::first-line、p::first-letter、p::first-line，旧版本浏览器用一个冒号：，`:first-line`,`:first-letter`,`:before`,`:after`。）：：兼容性----IE6+、Firefox、Chrome、Safari、Opera

22、X:nth-child(n)（n从1开始顺着数，还可以写成`li:nth-child(4n)`去每隔3个元素获取一次标签）：：兼容性----IE9+、Firefox3.5+、Chrome、Safari

23、X:nth-last-child(n)（倒着数回去）：：兼容性----IE9+、Firefox3.5+、Chrome、Safari、Opera

24、X:nth-of-type(n)（有5个`ul`标签。如果你只想对其中的第三个进行修饰，如：ul：nth-of-type（3））：：兼容性----IE9+、Firefox3.5+、Chrome、Safari

25、X:nth-last-of-child(n)（倒着数回去）：：兼容性----IE9+、Firefox3.5+、Chrome、Safari、Opera

26、X:first-child：：兼容性----IE7+、Firefox、Chrome、Safari、Opera

27、X:last-child：：兼容性----IE9+、Firefox、Chrome、Safari、Opera

28、X:only-child（获取只有一个子标签的父标签）：：兼容性----IE9+、Firefox、Chrome、Safari、Opera

29、X:only-of-type（定位某标签只有一个子标签的目标）：：兼容性----IE9+、Firefox3.5+、Chrome、Safari、Opera

30、X:first-of-type（指定标签的第一个兄弟标签）：：兼容性----IE9+、Firefox3.5+、Chrome、Safari、Opera