选择器冲突时,系统如何处理
来源:互联网 发布:梦幻西游mac版好不好用 编辑:程序博客网 时间:2024/06/05 02:34
有的时候我们为同一个元素设置了不同的CSS样式代码,那么元素会启用哪一个CSS样式呢?我们来看一下面的代码:
p{color:red;}.first{color:green;}<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
p和.first都匹配到了p这个标签上,那么会显示哪种颜色呢?green是正确的颜色,那么为什么呢?是因为浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式。
下面是权值的规则:
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。例如下面的代码:
p{color:red;} /*权值为1*/p span{color:green;} /*权值为1+1=2*/.warning{color:white;} /*权值为10*/p span.warning{color:purple;} /*权值为1+1+10=12*/#footer .note p{color:yellow;} /*权值为100+10+1=111*/
层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。
注意:还有一个权值比较特殊--继承也有权值但很低,有的文献提出它只有0.1,所以可以理解为继承的权值最低。
我们在做网页代码的时,有些特殊的情况需要为某些样式设置具有最高权值,怎么办?这时候我们可以使用!important来解决。
0 0
- 选择器冲突时,系统如何处理
- 如何处理散列冲突
- 如何处理jQuery选择器中的特殊符号
- 如何处理jQuery选择器中的特殊符号
- hash是如何处理冲突的?[转]
- javacc如何处理token类型冲突问题
- hash是如何处理冲突的?
- hash是如何处理冲突的?
- hash是如何处理冲突的?
- java.util.hashMap如何处理冲突
- git冲突时的处理
- 当ViewPager嵌套在ScrollView/ListView里时,手势冲突如何处理?
- 当ViewPager嵌套在ScrollView/ListView里时,手势冲突如何处理?
- c# 文本框纪录快捷键并处理冲突的系统热键
- 系统级dialog与软键盘的冲突处理
- jQuery解决冲突,及选择器
- 如何处理sql2k 和winxp sp2冲突的问题
- git如何处理别人的pull request及解决冲突
- UIView,UILabel,UIButton,
- android px与dip间的转换
- 领导力须突破命令控制式管理
- SQLite的事务操作
- node js资料
- 选择器冲突时,系统如何处理
- struts2拦截器注解<struts> <package name="default" extends="struts-default"> <interceptors> <interc
- trie树Java实现
- IOS布局
- 23种设计模式搞笑解释
- 如何记忆网络掩码和位数的对应关系
- 一个不小心引发的问题,installation failed invalid argument
- 大数据:通过Mesos、Docker和Go,使用300行代码创建一个分布式系统
- set name utf8原理