IE问题：它可以处理多少CSS包含？

Question

在引用Drupal时我遇到了一种奇怪的行为。我转了几个模块，为页面添加了5到10个链接标签。虽然这些新的样式表已添加到Firefox的级联中，但在IE8中，通过添加这些样式，浏览器丢弃了先前从层次结构中添加的CSS文件。事实上，第一个文件是第一个去，这完全搞砸了页面的样式，让我挠了一下头。最终我发现新添加的模块导致IE通过了一些内部阈值，无法再添加新的包含。

之前有没有人见过这种行为？我不确定浏览器或我的设置是否存在问题。

Answer 1

Internet Explorer的最大限制为32个CSS文件链接。绝对是一个浏览器问题。您需要考虑整合您的CSS请求。

一般来说，如果它们是静态文件，你可以通过连接它们来实现这一点，但是如果你以编程方式生成它们，你可能需要查看一个解决方案来在响应传递给浏览器之前对其进行操作。

我们不得不为我们的企业ASP.Net项目解决这个问题，最后编写了一个“Css Multiplexor”来检查响应，找到了所请求的CSS链接，为一个大的css文件生成了一个Web资源，并输出了一个链接到那个。

Answer 2

我在我们的网站上遇到过这个问题。

IE8每个文件只允许32次CSS导入。该文件可以是HTML文件或CSS文件。 （*）但是，导入限制不会限制您总共32个CSS文件。您可以链接到HTML中的两个CSS文件，每个文件@imports 32个CSS文件。玩这样的技巧应该可以满足你的需要。

我们使用的具体解决方法是将我们需要的CSS文件分成两组，并有两个“导入”CSS文件。 HTML页面导入第一个导入CSS文件，导入第一个组和第二个导入CSS文件，导入第二个组。

这样可以正常工作，但会产生大量HTTP请求，因此我们只在开发系统上使用此解决方法。对于我们的实时网站，我们有一个构建步骤，可以将所有CSS编译成一个文件。

Johannes 提到了什么 - 让Drupal汇总您的CSS - 听起来是最好的选择。

（*）有一些很好的印刷品：32个导入包括已从HTML页面链中导入的CSS文件。因此，如果您的HTML导入CSS文件，那么该CSS文件只能导入31个其他第二层CSS文件，而每个第二层CSS文件只能导入30个其他第三层CSS文件。你真的不得不怀疑奇怪的算法会导致这种限制......

Answer 3

限制为31 - 不是32！

虽然有些人会说“谁在乎，足够近，对吧？” ---对于拥有数百名开发人员的大型应用程序，页面可以非常容易地超出限制，因此您应该确实知道页面上可以包含css样式表的确切数量。

有几种方法可以缓解这个问题：

1. 通过整合到更大的文件中来减少CSS文件的数量 - 可能是手动或一些运行时分组机制，或者您可以使用自动css编译器来组合和最小化所有CSS文件
2. 使用@import url(...)语句而不是<link href="">，但请记住，在一个样式表中只能有31个@import（同样，非32 ...）语句

谨慎使用上面的＃2，因为：

1. 您只是增加限制（到961个css文件）而不是删除它
2. 浏览器将被强制下载CSS文件而不是parellel。通常，浏览器一次可以下载超过1个css文件（计数取决于文件是否在同一个域中以及您使用的是哪个浏览器） - 这会对性能产生重大影响。
3. 每个CSS文件都需要往返服务器，这会增加额外的时间。