应用订单的CSS文件

Question

我有一个关于CSS文件的问题，它是在浏览器中应用的顺序。 我们有：

1. 浏览器（系统）CSS文件，
2. 用户CSS文件，
3. 用户CSS重要文件，
4. 网站CSS文件，
5. 网站CSS重要文件，

当加载页面时，一些CSS代码会根据顺序或重要单词替换其他代码。上面列出的顺序是否正确，因此网站CSS重要文件可以覆盖以前的所有样式？

Answer 1

CSS代码不会替换其他CSS代码，并且解析样式表的顺序无关紧要。实际上没有申请顺序，因为所有适用的样式表都被考虑在内。当多个样式表为元素的属性赋值时，将根据cascade rules解决冲突。顺序是：

1. 用户代理声明（浏览器默认样式）

2. 用户正常声明

3. 作者（页面）正常声明

4. 作者（页面）重要声明

5. 用户重要声明

所以作者（页面）!important声明胜过除用户!important声明之外的所有内容。在Css 1中，顺序是不同的，但是在CSS 2中改变了这一点，浏览器遵循现行规则：如果用户希望行使其权利，则用户总是有最后一个字。

Answer 2

没有。用户CSS文件将在站点CSS文件之后进行解析（否则，拥有用户CSS文件没有任何意义）。这并不意味着它会自动覆盖网站的css文件中的所有内容，但正常CSS specificity rules仍适用。

让我们将所有段落设为红色，例如我的网站有以下规则：

website.css: p { color: red; }

但如果我实现用户样式表（如FireFox中的userContent.css）并说：

FireFox userContent.css: p { color: blue; }

文字颜色为蓝色。

如果我然后标记网站的规则很重要：

website.css: p { color: red; !important }

颜色会再次变红。