0

节日问候堆垛机。我使用 IE7 和 IE8 的 respond.js polyfill 和 html5.js shiv 完成了一个带有CSS媒体查询的响应式站点。当我第一次在这些浏览器中加载页面时,在正确的字体样式开始之前,会有短暂的大尺寸文本闪烁,有时在 Times Roman 中。有没有其他人看到这个问题,或者任何人都可以建议我做错了什么?我没有使用网络字体。我在 ems 中调整字体大小。我尝试将我的正文字体设置为 10px 和 62.5%,但似乎没有什么不同。这是 Respond polyfill 的特性吗?

祝大家欢呼

4

2 回答 2

1

您正在试验FOUC!无样式内容的 Flash。该链接包含避免这种情况的方法;如果你异步加载你的样式,它可以解释为什么你在页面生命中尝试你的样式还没有应用于你的内容的这个时刻。这可能是由于您使用了 polyfills 造成的,我建议您在加载页面的同时加载一次性样式以将其最小化。

于 2011-12-27T09:27:53.227 回答
1

你帖子上的链接对我来说是坏的,所以我看不到代码。

此行为的一个可能原因是包含外部 css 文件的方法。如果您曾经@import尝试使用<link>element 并确保将所有 css 文件包含在<head>元素中(而不是在正文中)

另一个原因可能是由于过多的重量或这些 css 文件的数量:浏览器可能需要很长时间才能加载和解析所有规则,因此,如果您的服务器启用了提供压缩内容,请尝试提供所有 css 文件使用 gzip 压缩(或在最旧的 apache 上放气),如果可能,还尝试减少 css 请求的数量(您可以查看 html5 样板的 .htaccess 以获得有效示例)

如果将所有 css 文件合并到一个文件中,通常 gzip 压缩比一次压缩一个文件效果更好。

最后但同样重要的是,提高 CSS 规则的性能:始终使用深入的特定规则并始终避免通用语句,* { margin: 0; padding: 0 }因为浏览器通常会花费更多时间将这种样式应用于元素

于 2011-12-27T10:20:41.183 回答