在HTML页面中加载CSS文件的顺序是什么？

Question

我想知道在HTML页面中加载CSS文件的顺序。

我的实际要求是这样的：我的应用程序中有超过10个CSS文件。

我在每个HTML页面中导入3到4个CSS文件。问题是我有一些CSS文件中定义的重复类。这意味着我重写了CSS文件中的一些CSS类。 在某些页面中，它的行为正确。在某些页面中，它表现错误。我也为HTML页面中的某些DIV定义了内联样式。我也为那些DIV保持CSS类。

任何人都可以知道哪一个会优先考虑哪一个或先加载哪一个？

Answer 1

通常，最后一条规则优先。话虽如此，有一些“例外”，内联样式优先于外部样式表（内联！重要比外部重要更重要等），更具体的选择器覆盖通用选择器。

阅读所有相关内容@ http://www.w3.org/TR/CSS2/cascade.html

Answer 2

CSS文件按照它们在页面中显示的顺序加载。如果在CSS文件中重新定义了一个类，它将覆盖以前的类语句。

因此
div.sample { background: none; width: 200px }
和
div.sample { color: #FFF; width: 400px }
将成为
div.sample { background: none; color: #FFF; width: 400px }

您还可以使用'！important'插件使规则优先于其他已定义的规则。

因此
div.sample { background: none; width: 200px !important }
和
div.sample { color: #FFF; width: 400px }
将成为
div.sample { background: none; color: #FFF; width: 200px !important }

注意：很多人会在CSS文件中使用'！important'插件来建议反对。就个人而言，我认为没有错。

Answer 3

每个元素都将根据最后一个样式表中的属性进行渲染。已声明为!important;的属性是一个例外。部分问题是你有10个样式表。