IE6对多个CSS样式的解析

测试代码复制代码代码如下: <html> <head> <title>IE6对多个CSS样式的解析</title> <style type="text/css"> body { font-size:12px; } .West { color:Green; } .West.Color { color: Red; } </style> </head> <body> 大师兄，师傅被妖怪抓走了。 二师兄，师傅被妖怪抓走了。 大师兄，二师兄被妖怪抓走了。 大师兄，师傅和二师兄被妖怪抓走了。 师傅放心吧，大师兄会来救我们的。 </body> </html> 解析效果测试代码增加了新的样式复制代码代码如下: <html> <head> <title>IE6对多个CSS样式的解析</title> <style type="text/css"> body { font-size:12px; } .West { color:Green; } .West.Color { color: Red; } .East.Color { color: Blue; } </style> </head> <body> 大师兄，师傅被妖怪抓走了。 二师兄，师傅被妖怪抓走了。 大师兄，二师兄被妖怪抓走了。 大师兄，师傅和二师兄被妖怪抓走了。 师傅放心吧，大师兄会来救我们的。 </body> </html> 解析效果如果样式改成这样复制代码代码如下: <html> <head> <title>IE6对多个CSS样式的解析</title> <style type="text/css"> body { font-size:12px; } .West { color:Green; } p.West.Color { color: Red; } .East.Color { color: Blue; } </style> </head> <body> 大师兄，师傅被妖怪抓走了。 二师兄，师傅被妖怪抓走了。 大师兄，二师兄被妖怪抓走了。 大师兄，师傅和二师兄被妖怪抓走了。 师傅放心吧，大师兄会来救我们的。 </body> </html> 解析结果，原来在IE6中显示为蓝色的都显示为红色。而FF保持不变。结论在IE6中，连续拼写的两个样式，.class_1.class_2，识别为后一个.class_2。后定义的优先。在FF中，必须匹配完整的样式，少一个都不识别。如果加上了p限定，则优先级高于不加p的样式，参考CSS优先级。

　　推荐阅读

　　CSS定义字体间距字体行与行间距

CSS定义字体行间距 line-height:xxpx; CSS定义字体间距下面我们讲述一下CSS的文本属性，还是先来看一下文本属性的详细列表：属性属性含义属性值 Word-spacing 定义了各个单词之间的间距 Normal<length>必须以>>>详细阅读

本文标题：IE6对多个CSS样式的解析

地址：http://www.17bianji.com/kaifa2/CSS/16554.html

1/2 1