这是一个class(类)选择器。class选择器与id选择器的不同是class选择器能作用于期望样式化的一组元素。 兼容浏览器:IE6+、Firefox、Chrome、Safari、Opera 4. X Y
li a {
text-decoration: none;
}
复制代码
这也是我们最常用的一种选择器——后代选择器。用于选取X元素下子元素Y,要留意的点是,这种方式的选择器将选取其下所有匹配的子元素,无视层级,所以有的情况是不宜使用的,比如上述的代码去掉li下的所有a的下划线,但li里面还有个ul,我不希望ul下的li的a去掉下划线。使用此后代选择器的时候要考虑是否希望某样式对所有子孙元素都起作用。这种后代选择器还有个作用,就是创建类似命名空间的作用。比如上述代码样式的作用域明显为li。 兼容浏览器:IE6+、Firefox、Chrome、Safari、Opera 5. X
子选择器。与后代选择器X Y不同的是,子选择器只对X下的直接子级Y起作用。在上面的css和html例子中,div#container>ul仅对container中最近一级的ul起作用。从理论上来讲X > Y是值得提倡选择器,可惜IE6不支持。 兼容浏览器:IE7+、Firefox、Chrome、Safari、Opera 9. X ~ Y