Html 单个css或多个用于响应性设计-css速度

对于许多css文件和一个css文件，他们已经有很多问题，解决方案是使用一个css文件，因为http请求更少。这不是我要问的：P

我通常会使用两个css文件。一个用于整个站点，另一个用于覆盖特定页面

我的想法是，它将加快css的速度，因为没有那么多css选择器需要为页面上的每个元素进行评估

要求客户端再下载一个可缓存的css文件似乎值得加快浏览器的渲染速度。特别是对于大型网站或需要为每个页面定制大量css的网站

另一方面，页面文件将有额外的媒体查询

---

您认为最好的解决方案是什么？

虽然技术上正确的答案需要关于服务器性能、访问者行为以及您设计的网站类型的内部信息，但我想解释一下我使用一个或多个CSS文档的基本理据

对于任何小的、基本的站点，我都会坚持使用一个CSS文档，不会提出任何问题。然而，一旦网站变得更加复杂，可能会出现使用更多文档的情况

如果一个站点有几个页面具有非常不同的CSS和/或标记，或者有一个单一类型的页面（如活动登录页），或者有几个非常不同类型的内容（如论坛、博客或类似内容），那么我认为在许多文档中拆分样式表是有意义的

同样，上述样式表的结构取决于您正在设计的站点类型。全局规则（如规范化/重置CSS、一般结构和媒体查询）可以在一个文档中，而将特定于页面的规则保留在另一个文档中

---

这对我来说很有意义，因为你的访问者可以缓存应该在每个页面上使用的基本结构，而无需下载你的博客或活动页面所需的所有CSS，直到他们真正访问它。

我同意，如果你有一个具有不同页面类型的大型网站，你应该将CSS拆分为不同的文件。然而，我认为这不应该基于页面。它应该在组件上制作。当你设计CSS时，你必须把你的页面分成模块。模块应包含其样式和媒体查询。我发现将媒体查询放在不同的文件中会导致开发缓慢。您甚至可能最终得到类似CSS构造函数的东西。也就是说，一个选择特定模块的工具，将它们组合在一个文件中，然后像这样服务器。您仍然只有一个文件，但其内容不同

---

对于CSS优化，请查看此工具

CSS引擎速度很快。不用担心（除非使用糟糕的退化选择器）。有一些工具可以自动组合CSS文件以提高部署性能（更少的请求、无用的选择器删除、压缩），因此无需为开发目的只创建一个文件（因为一个文件是一场噩梦）。我个人使用较少，但在工作中我不允许这样做。我们不会缩小css（所以我想客户端可以修改它）。css文件是组合的，可以超过3k行！对于一个特定的页面，很多页面将有200-300行css。与我所做的其他网站相比，响应速度似乎真的很慢。无用的选择器移除？你能提供更多的细节吗？我总是最小化css，客户端可以在开发版本中修改css，然后缩小并推到生产版本，客户端很有可能不是技术人员，使用最佳且安全的缩小css。是的，它们应该在开发阶段的组件中分解。我的问题更多的是关于生产和HTTP性能与浏览器渲染性能的对比。我个人使用较少，在生产中我有一个全局css文件和一个页面。该页面将加载导入较少的组件。我可以说浏览器在呈现CSS方面真的非常快。我想这不是什么关键的事情。在大多数情况下，您应该关注HTTP性能部分。即，较低的文件大小和仅一个http请求。