对CSS选择器权重的理解
CSS页面中会用到很多CSS选择器。至于他们的体重,很多朋友都不会很清楚。下面是下一个测试的详细介绍,看看会发生什么。复制代码代码如下所示:
div.ui_infor p {字体大小:16px;}
。ui_infor p {字体大小:14px;}
复制代码代码如下所示:
测试CSS
上面的例子中,最终的显示效果是字体大小:16px,不是字体大小:14px回来;
组合器的选择器有一个快速的判断方法:
0,0,0,0
第一个值是表示在标签上的样式,例如
复制代码代码如下所示:
的数值ID选择器的第二代表,如#演示{ }
Third numerical represent: class name (.Demo {}) or pseudo class (hover) or attribute selector {rel=; xx;}
第四个数字表示:标记选择器{ }
现在在实践中使用第一个例子。
复制代码代码如下所示:
div.ui_infor p {字体大小:16px;}
重量:0,0,1,2
复制代码代码如下所示:
。ui_infor p {字体大小:14px;}
重量:0,0,1,1
结果:0,0,1,2 > 0,0,1,1,所以字体大小:16px显示;
补充:重要的权重是最高的,所以你不需要判断,但在IE 6浏览器的bug。
实例uff1a
复制代码代码如下所示:
P {字体大小:18px!重要的;字体大小:12px;}
在IE 6的浏览器,它是字体显示:12px,还有一些在网上说IE 6不支持数据!重要的是,事实上是错误的。
我们正在看例子:
复制代码代码如下所示:
P {字体大小:18px!重要的;}
P {字体大小:12px;}
在IE 6,它显示字体大小:18px,即是支持IE 6!重要的是有点怪异和怪异。它是用相同的名字写的。重要的财产被后者所涵盖。
在P {字体大小情况:18px!重要的;字体大小:12px;},字体大小:12px覆盖字体大小:18px!重要。
使用这种奇怪的,你可以不使用css_hack实现在IE 6分钟height
复制代码代码如下所示:
P {最小高度:50px;高度:汽车!重要的;身高:50px;}