css样式规则的简要总结

          css与文档关联起来发挥作用。

          css文件中是各种样式规则，由选择器和声名块构成。声明块由多条声明组成。选择器是声明要作用的对象，声明是对具体规则的描述。

          声明由属性和值组成,值或是属性的错误都会使该条声明失效.但是后续的声明可以继续发挥作用.一般情况下,属性值是由关键字或是关键字列表组成.关键字之间通常是空格来分界,但例外是可以在:字体大小/行高格式上使用"/".选择器分为:通配选择器、元素选择器、id选择器、类选择器、属性选择器、伪类选择器、伪元素选择器、后代选择器、子代选择器、相邻兄弟选择器、普通兄弟选择器。下面分开说明：

  1、元素选择器

       元素是构成文档的基础。当然主要是html文档但是并不限于html,在xml中也可以使用。这自不用说，直接使用元素就是了。

  2、通配选择器

       该选择器使用通配符*，匹配所有的元素。问题在于不要滥用，在特殊性上，它的特殊性位0,但是强过没有特殊性的继承的方式。

  3、id选择器和类选择器

      二者独立于元素,也就是说可以代表了一类条件,而且是区分大小写的。不同在于：id具有唯一性，不支持多类的多个词空格的形式。书写上的差异不表。id会在javascript中建立全局变量。

 4、属性选择器。该选择器会依据属性的特性来选择元素。分为：简单属性选择器（包含属性的有无，同常是做校验使用)、具体属性选择器、部分选择器（~= ^=  *=  $=）、特殊属性选择器（|= 通常用于选择语言，健壮性不如：lang这个伪元素）。

 5、后代选择器。它是基于良好的文档结构的。所以良好的文档结构是非常重要的。直接将元素列出来就可以了。不管嵌套结构有多么深都会使用.

 6、子代选择器。由于子代应用的面太大，需要更加精确地控制方式。子代选择就出现了。

 7、相邻兄弟选择器。该选择器实际上要求比较严格，选择的是元素之后紧邻的元素，只会是一个。但有时好像选择了第一个之后的所有，只是因为本是选择了全部了。例如：ol li + li 会选择除第一个之后的所有。原因是ol li选择了所有的li.然后是所有的li选择兄弟元素。

 8、 普通兄弟选择器.a ~ b.这种方式会更加的宽松，允许间隔，只要有相同的父元素就可以了。

 9、伪类与伪元素。二者在元素的文档中都不会存在，而是由用户代理（主要是浏览器）产生。这是一种幻象的产生方式。伪类：：link :visited :focus :hover :active :lang()  :first-child :nth-child。伪元素也是由用户代理来产生的。主要有：:first-line  :first-letter :after :before等。前两个主要用于块级元素，但不会限与块级元素。但对可用的属性还是有限制。而且必须在选择器的最后，如P:first-line em就会出错。后二者如:after {content:"value";}。

 

转载于:https://www.cnblogs.com/hustliliangmin/p/6113683.html