单个巨大的。css文件vs.多个较小的特定。css文件?

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

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

我觉得这样更好

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

vs.

site.css

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

当前回答

整体样式表确实提供了很多好处(在其他答案中有描述)，但是根据样式表文档的总体大小，您在IE中可能会遇到问题。IE对从单个文件中读取的选择器数量有限制。限制为4096个选择器。如果你是单片样式表，你会想要拆分它。这种限制只会在IE中暴露出来。

这适用于所有版本的IE。

参见Ross Bruniges博客和MSDN AddRule页面。

2010-02-25 23:19:28

其他回答

你可以只使用一个css文件来提高性能，然后像这样注释掉部分:

/******** Header ************/
//some css here

/******* End Header *********/


/******** Footer ************/
//some css here

/******* End Footer *********/

etc

2010-02-25 18:01:38

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

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

2010-02-25 17:58:21

以下是最好的方法:

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

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

2011-12-07 18:23:16

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

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

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

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

2013-02-25 08:52:57

捆绑的样式表可以节省页面加载性能，但是样式越多，浏览器在页面上呈现动画的速度就越慢。这是由于大量未使用的样式可能不在您所在的页面上，但浏览器仍然需要计算。

参见:https://benfrain.com/css-performance-revisited-selectors-bloat-expensive-styles/

捆绑样式表的优点: -页面加载性能

捆绑样式表的缺点: -较慢的行为，这可能会导致滚动，互动，动画，

结论: 为了解决这两个问题，对于生产来说，理想的解决方案是将所有css捆绑到一个文件中保存在http请求中，但使用javascript从该文件中提取您所在页面的css并使用它更新头部。

为了了解每个页面需要哪些共享组件，并降低复杂性，最好声明这个特定页面使用的所有组件，例如:

<style href="global.css" rel="stylesheet"/>
<body data-shared-css-components="x,y,z">

2016-10-21 07:26:19

单个巨大的。css文件vs.多个较小的特定。css文件?

推荐文章

最新文章

标签