我最近偶然发现一个项目，该项目有同一主题使用的27个不同的CSS文件，它们用于应用程序中的特定部分，规则如下所示：菜单栏有一个CSS文件，联系人表单有两个文件，页脚有另一个文件，特定页面格式有两个，画廊有两个。
所以我问lead这么多CSS文件的原因是什么，连接起来是否安全。
他的回答是，所有文件的总大小为126KB，带宽很重要，并且有500+CSS规则，所以最好不要连接以防止选择器冲突。
我知道126KB的未压缩CSS文件太多了，但我也知道（从最佳实践指南中）所有这些文件都应该一次性下载，所以浏览器会缓存一个大文件，而不是在浏览会话中逐个下载。
为什么我不让自己把所有这些文件粘在一起？这有什么大不了的吗？
由于级联的工作方式，如果按照文件在源中出现的顺序保存文件，则不可能仅通过将文件连接在一起来造成危害。这将确保以后的文件覆盖以前的文件仍然可以这样做
然后，您可以考虑缩小CSS。这不会改变选择器的功能，但会压缩它们以减少带宽。
总而言之，拥有27个CSS文件简直太愚蠢了。用户必须等待27个连接建立、请求和下载完成，才能看到页面。现在，通过适当的缓存，这确实有所改善，但即使如此…
为什么我不让自己把所有这些文件粘在一起？这有什么大不了的吗？
如果您知道CSS文件没有任何冲突的指令，并且它们应该以相同的顺序加载到应用程序中的每个页面，那么您应该，事实上，将它们捆绑到一个缩小的CSS文件中。
但仅此而已。通常，当你发现自己处于这种情况时，很难辨别哪些CSS指令应用于哪个屏幕。
强调：你所面临的情况表明你欠了技术债。
虽然我同意27个CSS文件是完全疯狂的，理想情况下应该合并和缩小它，但在一些用例中，划分样式表是有意义的。
考虑一下：您正在处理一个子网站，该网站需要大量的CSS规则，而这些规则在网站上没有使用。如果不能保证用户同时访问子站点和主站点（因此可以利用缓存），那么保留两个样式表是有意义的，这样浏览器就不必阅读一个巨大的样式表来查看是否有任何内容与HTML文档匹配。
现在，这种情况并不常见，但确实会发生。一个例子是一家大公司，有很多分支机构都有自己的网站。它们可能为所有共享样式（特定于公司的UI等）包含一个样式表，并为布局和覆盖包含单独的样式表。
也就是说，我非常怀疑27个样式表是否有意义。原作者可能没有任何线索，并认为这是更结构化的方式。模块化的CSS实际上非常整洁，但在到达客户端之前，应该始终对其进行合并和缩小。这是SASS中常见的工作方法。对于网站的特定部分或功能，你会有很多部分样式表，但一旦你点击Ctrl+S，它就会自动合并到一个整洁的小包中。
现在，您只需访问每个页面并记下顺序，就可以弄清楚网站上CSS文件的加载顺序。这将是一项乏味的工作，不能保证它会有真正的回报，但它是可以做到的。