问题
Microsoft 的 IE 支持文档解释说,在 Internet Explorer 6-9 中:
- 前 31 个样式标签之后的所有样式标签都不会应用。
- 不应用前 4,095 条规则之后的所有样式规则。
- 在使用@import 规则持续导入外部样式表的页面上,导入其他样式表的页面,超过三层深度的样式表将被忽略。
需要解决方案
我们需要一种方法来拆分资产管道中 Sprockets 生成的已编译样式表,以保持最大选择器计数低于 4096,并在已部署的 Rails 应用程序的 HTML 中链接到它们。我们如何将已处理资产(特别是样式表)的编译输出作为参数传递给可以修改文件的方法?
请参阅以下尝试以了解起点。如果有人可以帮助我找到一种方法来使任一操作(或全新的解决方案),那就太棒了!
现有的解决方案尝试
Bless是为了解决这个问题而创建的,它通过拆分样式表以将每张表的最大选择器计数保持在限制之下。Bless 在 node.js 中的服务器上运行。我还没有看到一个 Ruby 等效的。Eric Fields 尝试将使用 compass 编译的资产提供给 Bless(在节点中运行),但该解决方案依赖于 Compass 处理资产编译,因此似乎不适用于资产管道。请注意,Bless 不是链接到多个样式表,而是将
@include
语句添加到第一个表中,这可能是避免接触标记的方法。当 Christian Peters (@crispy)发现这个问题时,他实现了一个像 Bless 这样的分离器,它也将 Compass 输出传递到一个自定义模块,这在 Rails 3.1 之前工作得很好。后来,他使用 SprocketsEngine 调整了他的拆分器,以便与 Rails Asset 管道集成。我已经尝试实现新代码,但它似乎不能自动运行(尽管在控制台中手动调用拆分器时工作正常)。
相关信息
有关 IE 6-9 中的 CSS 限制的更多信息,请参阅以下相关问题: