.div1p{color:red;}一、选择器1、基础选择器1）标签选择器：div{}，全选，不选一个，用来形容“共性”。2）类选择器：.classname{}多个元素可以同时属于某个类；一个元素可以同时属于多个类选择器，用空格分隔，类名顺序不重要Ah3不要尝试使用类名编写元素的所有样式。这个元素需要再携带几个类来共同实现这个元素的样式。每个类尽量小，有“public”的概念，这样可以使用更多的标签。3）id选择：#idname{}元素的id属性，一个元素只能有一个id，页面上不允许多个元素有相同的id。Q：你用的是id还是class？答：尽量使用class，除非非常特殊的情况下可以使用id。原因：id被js使用了。也就是说，js需要通过id属性来获取标签，所以我们尽量不要在css层面使用id，否则js会很别扭。在另一个层面上，我们会认为带有id的元素具有动态效果。2、高级选择器1）后代选择器：空格表示后代选择器.div1p{color:red;}.div1p是.div1的所有p后代。注：是后裔，不一定是儿子；空格可以出现多次补充：后代选择器中出现的东西很灵活，可以是标签，可以是类名，可以是id名后代选择器是一种平衡：共性的平衡和特点。当你想改变某一部分所有东西的样式时，你一定会想到后代选择器。2）路口选择器：没有空格，h3.special{color:red;}写在旁边必须同时满足两个条件：必须是h3标签，然后必须有一个特殊的类交集选择器，我们通常使用以标签名开头3）联合选择器：用,分隔4）子选择器：使用>，兼容IE7，不兼容IE6。与后代选择器的区别：子代选择器作用于第一代后代（即儿子），后代选择器作用于所有后代。例子：.food>li{border:1pxsolidred;}//sonselector.foodli{border:1pxsolidred;}//offspringselector5)Nextbrotherselector:用+号表示下一个选择Abrother;IE7兼容，IE6不兼容。示例：h3+p{color:red;}6)序列选择器：兼容IE8，不兼容IE6、7。ulli:first-child{color:red;}//选择第一个liulli:last-child{color:red;}//选择最后一个li2.级联1、如果多个选择器应用于同一个元素，如何判断该元素使用了哪些样式？浏览器使用级联方法来确定使用哪种样式。即具体哪个选择器，就使用选择器对应的样式。2、级联：是CSS处理冲突的能力。3.特异度的计算方法：4)将以上三位数字组合起来，看成一个实数：例如100>010>001，得到的特异度数越大，则规则越特异。4、案例：例一：.special2:010.special1:010在css文件中位置越低，优先级越高。因此，显示.special2的颜色。注意：同一个元素被多个类选择器修饰，属性描述冲突。只与css中类名的顺序有关，与标签中类名的书写顺序无关。例2：#box1.hezi2p:111divdiv#box3p:103div.hezi1div.hezi2div.hezi3p:034所以显示红色例3：注意：下图中前两条css规则不直接描述p的样式，所以对于p元素，权重为0。第三条规则直接描述p元素，权重为001。例4：如果css规则中没有直接描述p的规则，继承用来。浏览器会查看p元素的祖先，从它的父元素开始，试图找到color属性的值。p元素的父元素为，计算其权重，div显示红色，则p为红色5、!important：增加一个属性的权重。这个属性的权重是无限的。1）但是在一个选择器中，如果写在一个属性之后，只是增加了该属性的权重，并没有增加选择器的权重。2）并且它不能增加继承的权重，应该是0还是0。
