CSS的良好实践 - 每页一页？

Question

问题很简单：这是一个很好的做法，我们有一个“主CSS文件”（相同的母版页概念），并且对于每个页面，都有一个特定且唯一的CSS文件？

我问这个是因为我认为在不使用它的页面上使用非常不同的代码是没用的 - 你们都能理解我吗？

Answer 1

从UI的角度来看......

在以下情况下使用单独的CSS：

• 你有几乎独立的页面，不常见的东西
• 您需要在不同项目中重复使用特定页面

使用单个CSS：

• 你有很多共同的风格

Answer 2

使用一个主CSS文件而不是拥有主文件和几个特定CSS文件的最大优点是

1. 您可以节省HTTP请求时间和资源。如果您有多个文件，则需要多次调用服务器并浪费元数据。
2. 一切都在一个地方，你可以更容易地编辑它们。 CSS变得更适合您的网站。
3. 缓存有很大帮助。

主文件中的冗余/未使用样式规则可能太少而且​​不重要。

Answer 3

在我看来，最好使用尽可能少的样式表（css）和JavaScript文件来减少HTTPS请求的数量。

拥有一个大的css文件比使用5个不同的文件更好，因为在初始请求之后，css文件很可能会在用户的浏览器中缓存，并且在首次请求后将提供缓存的CSS文件。

Answer 4

是的，出于以下原因，这是最佳做法：

当用户加载您的网站时，他们会在第一次加载时下载singel CSS文件 - 之后它将由他们的浏览器缓存在您的主域名下的网站上的每个页面。这意味着不再需要从服务器加载CSS文件来浏览您的网站并加快页面加载速度。

如果您从代码结构的角度来看存在分离问题，我建议您考虑一些CSS预编译器，例如SASS或LESS，这样可以让您更好地构建代码方式。