CSS选择器的权重是什么
这篇文章主要介绍了CSS选择器的权重是什么的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇CSS选择器的权重是什么文章都会有所收获,下面我们一起来看看吧。
成都创新互联公司为您提适合企业的网站设计 让您的网站在搜索引擎具有高度排名,让您的网站具备超强的网络竞争力!结合企业自身,进行网站设计及把握,最后结合企业文化和具体宗旨等,才能创作出一份性化解决方案。从网站策划到成都网站建设、网站建设, 我们的网页设计师为您提供的解决方案。
选择器的权重
权重就是我同个元素,有多个选择器的情况下,我该选择哪一个选择器的样式。
行内的样式
id的样式
class的样式
p标签的样式
通过上面的比较,可以得出,行内样式>id选择器>类选择器>标签选择器>通配符
那么有没有可能让标签选择大于所有的选择器呢,答案是有的,只要加上这行代码!important,任何选择器的权重就是无限大了。
行内的样式
id的样式
class的样式
p标签的样式
选择器的类型
ID选择器 #id
类选择器 .class
标签选择器 p,div等
属性选择器 [type="text"]
通用选择器 *
伪类选择器 :hover
伪元素选择器 ::before
子选择器、相邻选择器
选择器的权重
第一等:行内样式是 1000,行内样式虽然没被列入选择器里,但它的权重是最高的
第二等:id选择器是 100
第三等:类选择器、伪类选择。属性选择器、属性选择器 10
第四等:标签选择器和伪元素选择器 1
其他选择器的权重为0
继承的样式没有权重
如果等级相同,那么最后的样式会覆盖前面的样式
最后请记住!important 的权重是无限大的
权重的计算
将选择器的权重加起来
最终的样式是文字为蓝色
因为body input 的权重是2,body,input每个的权重是1,所以加起来就2
#id .input input{ color: yellow; }
上面的权重就是 100 + 10 +1 = 111
关于“CSS选择器的权重是什么”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“CSS选择器的权重是什么”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注创新互联行业资讯频道。
名称栏目:CSS选择器的权重是什么
标题链接:http://pwwzsj.com/article/gidjsd.html