html中style样式调用之id、class、style顺序

71 阅读 0 评论 47 点赞

我是靠谱客的博主隐形百合，最近开发中收集的这篇文章主要介绍html中style样式调用之id、class、style顺序，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

在写css样式的时候我们要注意的有顺序问题，更重要的时候style，class与id之间的优先级问题，在页面初次完工未经改变，或者页面复杂程度很小的时候，搞不清楚这三者之间的优先级问题，似乎并没有什么大的问题，但是一旦随着页面的更改完善，以及页面元素的错综复杂度增加，问题就显而易见了。
　　先来说说顺序的问题吧，比如说我们在整体的样式前面定义了一些连接的颜色之类的a{color:#F00}属性，但是在后面的样式规则中，我们不需要连接的颜色都是红色的，所以就需要重新定义他的颜色，但又不能完全重新定义，这就需要用到继承属性规则了，（本文的重点是说样式属性的优先级问题，至于继承的规则就不在多说了）上面所说的就是一个顺序的问题，页面总是会按照定义给他的最后的一个规则来显示
css代码如下：

*{ color:red；}//*表示所有的元素如果没有样式调用都会运用这种样式
body{ color:green；}
#id{ color:blue;}
.class{ color:yellow;}

http效果如下：