Css Firefox 3.5+中的非样式内容（FOUC）闪存；

在Firefox 3.5.x+的新版本中，我们试图克服一个令人讨厌且断断续续的FOUC，我们已经走到了尽头

我们尝试过：

• 禁用FF中的Javascript
• 通过删除DOCTYPE使用Quirks模式渲染
• 从用于附加CSS的

  @import

  移动到

• 打开和关闭串联
• 从concat中删除CSS文件，一次一个
• 在Firefox中关闭本地缓存
• 等

我们以前的版本从未出现过任何FOUC问题，所以我们对这个版本做了一些事情。到目前为止，我们所做的更改包括：

• 通过CSS为所有装饰图像使用数据URI上的Base64编码图像
• 将与“框架”相关的CSS文件与特定于页面的CSS文件分离，并将它们捆绑为两个单独的CSS文件

要重现问题。。。使用Firefox 3.5.x或3.6.x，然后：

前往：

使用用户名登录：'stack@yola.com'和密码：'stackoverflow'

登录后，您应该在

单击主导航中的帐户链接

帐户页面应该加载，您应该会看到一个FOUC。如果未发生FOUC，请清除缓存并重新加载页面

非常感谢您的帮助！：）

更新：

---

开发环境仍在展示FOUC，但前提是FireFox内存不足或安装了大量扩展。延迟和渲染速度肯定会影响此FOUC的可见性。

我可能错了，但这可能是并发连接问题。根据我的Firebug的“网络”标签

加载HTML页面只需花费大量时间-可能也是因为它位于开发服务器上样式表在HTML页面之后加载

我不能说完全理解这里发生了什么，但我会尝试将样式表放到另一个领域，作为第一个衡量标准。这会让Firefox立即建立连接

---

返回到普通图像而不是data:uri可能也是一个好主意，这将减少样式表的大小，并且data:uri在IE<8中根本不起作用

我可能错了，但这可能是并发连接问题。根据我的Firebug的“网络”标签

加载HTML页面只需花费大量时间-可能也是因为它位于开发服务器上样式表在HTML页面之后加载

我不能说完全理解这里发生了什么，但我会尝试将样式表放到另一个领域，作为第一个衡量标准。这会让Firefox立即建立连接

---

返回到普通图像而不是data:uri可能也是一个好主意，这将减少样式表的大小，并且data:uri在IE<8中根本不起作用

虽然这是一个非常古老的问题，但我在寻找同一问题的解决方案时发现了它。因此，我想发布解决方案供将来参考。我只需要将对CSS文件的引用移到需要放在标题中的外部Javascript的引用之上。

虽然这是一个非常古老的问题，但我在搜索同一问题的解决方案时发现了它。因此，我想发布解决方案供将来参考。我只需要将对CSS文件的引用移到需要放在标题中的外部Javascript引用之上。

嘿，Pekka-是的，在这种情况下，我们运行的是开发服务器。我们向IE7提供了一个MHTML文件，其中包含相同的base64图像。它工作得很好。@ndorfin是的，这不是问题的根源。这只会使样式表比平常大一点。我会试着把它放在另一个领域，也许你的答案没有直接回答眼前的问题，但你是唯一一个回答的人，所以我会给你分数：）@ndorfin好的。可惜没有修好！非常奇怪，这个。嘿，佩卡-是的，我们在这个案例中运行的是一个开发服务器。我们向IE7提供一个MHTML文件，其中包含相同的base64映像。它工作得很好。@ndorfin是的，这不是问题的根源。这只会使样式表比平常大一点。我会试着把它放在另一个领域，也许你的答案没有直接回答眼前的问题，但你是唯一一个回答的人，所以我会给你分数：）@ndorfin好的。可惜没有修好！很奇怪，这个。谢谢！我所有的js都在页面的底部，除了Modernizer在页眉的顶部-将其移动到样式下方是有效的。这非常有效！谢谢。这使我不必去钻研一堆黑客解决方案。我将在这里补充，这适用于任何脚本标记。即使是本地代码，也不会获取任何外部文件。谢谢！我所有的js都在页面的底部，除了Modernizer在页眉的顶部-将其移动到样式下方是有效的。这非常有效！谢谢。这使我不必去钻研一堆黑客解决方案。我将在这里补充，这适用于任何脚本标记。即使是本地代码，也不获取任何外部文件。