欢迎光临散文网 会员登陆 & 注册

说一说样式优先级的规则是什么?

2022-05-26 15:59 作者:朵宝特工007  | 我要投稿

得分点:!important、行内样式、嵌入样式、外链样式、id选择器、类选择器、标签选择器、复合选择器、通配符选择器、继承样式。

回答:CSS样式的优先级可以分为五大类。

    第一类!important,无论以何种方式引入,何种选择器,它的优先级都是最高的。

    第二类引入方式,行内样式的优先级要高于嵌入和外链,若嵌入和外链使用的选择器相同就看它们在页面中插入的顺序,后面插入的覆盖前面的。

    第三类选择器,选择器的优先级为id选择器 >(类选择器 | 伪类选择器 | 属性选择器)>(后代选择器 | 伪元素选择器)>(子选择器 | 相邻选择器)> 通配符选择器。

    第四类继承样式,是所有样式中优先级比较低的。

    第五类浏览器默认样式,优先级最低。

加分回答:使用!important要谨慎,一定要优先考虑使用样式规则的优先级来解决问题而不是!important。

    只有在需要覆盖全站或外部CSS的特定页面中使用!important。

    永远不要在你的插件中使用!important。

    永远不要在全站范围的CSS代码中使用!important。

    优先级的比较指的是相同的样式属性,不同样式属性优先级比较失效。比如:在设置max-width时注意,已经给元素的max-width设置了!important但是还不生效,很有可能就是被width覆盖了。

    举例:div最终的宽度还是200px 。


说一说样式优先级的规则是什么?的评论 (共 条)

分享到微博请遵守国家法律