拥有一个包含几乎每个页面都要使用的样式元素的怪物.css文件有什么好处吗?

我在想,为了便于管理,我想把不同类型的CSS拉出到几个文件中,并包括我的主<link />是坏的吗?

我觉得这样更好

positions.css buttons.css tables.css copy.css

vs.

site.css

你见过用一种方法做和用另一种方法做有什么问题吗?


当前回答

存在一个临界点,在这个临界点上使用多个css文件是有益的。

一个拥有100万以上页面的网站,平均用户可能只看到其中的5个,可能有一个巨大的样式表,所以试图通过大量的初始下载来节省每次页面加载的单个额外请求的开销是虚假的经济。

把这个论点延伸到极致——这就像是建议整个网络应该维护一个大的样式表。显然是荒谬的。

每个网站的临界点都不一样,所以没有硬性规定。这将取决于每个页面的唯一css数量、页面数量以及普通用户在使用网站时可能经常遇到的页面数量。

其他回答

我更喜欢多个CSS文件。这样就可以更容易地根据需要将“皮肤”换入和换出。单一文件的问题在于,它可能会失控,难以管理。如果你想要蓝色背景但又不想改变按钮怎么办?只要改变你的背景文件。等。

存在一个临界点,在这个临界点上使用多个css文件是有益的。

一个拥有100万以上页面的网站,平均用户可能只看到其中的5个,可能有一个巨大的样式表,所以试图通过大量的初始下载来节省每次页面加载的单个额外请求的开销是虚假的经济。

把这个论点延伸到极致——这就像是建议整个网络应该维护一个大的样式表。显然是荒谬的。

每个网站的临界点都不一样,所以没有硬性规定。这将取决于每个页面的唯一css数量、页面数量以及普通用户在使用网站时可能经常遇到的页面数量。

以下是最好的方法:

创建一个包含所有共享代码的通用CSS文件 将所有特定页面的CSS代码插入到同一页面中,在标签上或对每个页面使用属性style=""

通过这种方式,您只有一个包含所有共享代码的CSS和一个HTML页面。 顺便说一下(我知道这不是正确的主题),你也可以在base64编码你的图像(但你也可以用你的js和CSS文件)。通过这种方式,您可以将更多的HTTP请求减少到1。

对于页面的加载时间来说,只有一个CSS文件更好,因为这意味着更少的HTTP请求。

拥有几个小的CSS文件意味着开发更容易(至少,我是这么认为的:应用程序的每个模块拥有一个CSS文件会让事情变得更容易)。

所以,这两种情况都有很好的理由……

一个可以让你得到两个想法的最好的解决方案是:

使用几个小的CSS文件进行开发 也就是更容易发展 要为您的应用程序建立一个构建过程,将这些文件“组合”成一个文件 顺便说一句,这个构建过程也可以缩小那个大文件 这显然意味着你的应用程序必须有一些配置,允许它从“多文件模式”切换到“单文件模式”。 而要在生产中使用,只有大文件 即更快的加载页面

也有一些软件可以在运行时组合CSS文件,而不是在构建时;但是在运行时这样做意味着消耗更多的CPU(并且显然需要一些缓存机制,以避免太频繁地重新生成大文件)

单个CSS文件的优点是传输效率高。每个HTTP请求意味着每个请求的文件都有一个HTTP头响应,这需要占用带宽。

我把我的CSS作为一个PHP文件,在HTTP头中带有“text/ CSS”mime类型。这样,我可以在服务器端拥有多个CSS文件,并在用户请求时使用PHP include将它们推入单个文件。每个现代浏览器都会接收包含CSS代码的.php文件,并将其作为. CSS文件处理。