每个页面有一个CSS文件或单个CSS文件？

题

当我构建页面时，我是想为每个页面设置单独的样式表还是为整个站点设置一个大样式表？出于加载目的，单个文件不是更好的做法，因为加载时总css会减少吗？

解决方案

使用单个文件，CSS文件被缓存，因此减少了为每个访问过的新页面下载新文件的需要。

为了提供帮助，我通常会通过 CSS清洁工具来减少我的CSS，以减少文件大小，另外你可以 GZip CSS也使用.htaccess ，再次缩小。

最后将所有CSS放在一个文件中将使得系统范围内的更改变得更容易将来（我们首先使用CSS的全部原因），它也将使调试更容易。

编辑，2017年5月

7年多来发生了很多变化，任何看过这个答案的人都应该考虑研究更新的资产交付方法，特别是现在使用HTTP2和预处理器更为常见。

其他提示

一个不同的建议，在开发过程中使用多个样式表，并有一个机制将所有样式表合并为一个CSS文件以进行生产部署。这可能需要一些额外的编码和一些额外的脚本在生产部署之前运行，但是对于开发使用和生产使用都是理想的。如果该过程适当自动化（这不是很难实现），这也不会导致任何类型的错误。

样式表的主要目的是允许您更改所有页面的设计。如果您在每个页面上都有h1 {color:red;}，之后想要将其更改为蓝色，则必须编辑每个页面的样式表。使用一个样式表，您可以更改颜色并将其反映在整个站点上。

此外，样式表将缓存在用户的计算机上，而不是从每个页面下载。

如果您希望在网站的所有页面中使用一致的样式，请为所有常用样式使用一个样式表。否则，您可能会发现维护许多样式表非常困难。必须将更改添加到多个样式表中的每一个。

仅在单个页面上使用的样式表可以放在单独的样式表中。对于不常访问的网页的大型单页样式表和/或样式表，这可能最有用。

每次刷新页面时都不会重新加载样式表。如果您在主页上引用大型通用样式表，则只会下载一次，并进行缓存以备将来使用。

<！>“为了装载目的，你不想要一个更小的样式表，因此制作个别样式表是一种更好的做法吗？<！>

这可能会产生相反的效果，因为使用1个样式表可以将其缓存，然后轻松重新加载，而不断使用您的方法为每个页面加载新的CSS文件。

对于一种类型的媒体，大多数网站不需要有多个样式表。但是，如果您的网站在设计上有很大差异，我建议您使用具有所有常用属性的基本样式表，然后为包含差异的每个页面创建一个辅助样式表。

仅当CSS更改的大小足以保证使用单独的样式表时，才应使用此选项。

由于我实际上是一名真正的网络程序员（Java的网络编程，而不是PHP等脚本），我必须给你一个观点，我从未见过任何实际的网页设计师给予：

请继续，尽可能将CSS文件拆分为多个逻辑分区！如果你有一个非常风格化的表，收集它的CSS东西到一个文件，也收集实际页面的基本样式到另一个文件，将这些菜单导航CSS：s添加到第三个，依此类推。您当然可以重用单个CSS：s，它们是相关的，但不要只是把所有内容都塞进一个大文件中！

我遇到了这个寻求同样问题的主题。我的想法就是这样构建......

Layout.css <！> lt; ---用于网站上常见的网站结构，链接，标题等。 form.css <！> lt; - 通用表单样式 reset.css <！> lt; - 如果你使用它们，所有文件都会重置

目前我将pages.css用于所有页面样式..

或

homepage.css about.css gallery.css

许可以下： CC-BY-SA 和归因