zoukankan      html  css  js  c++  java
  • FOUC Flash Of Unstyled Content 文档样式闪烁

    问题描述

    偶然间看到FOUC这个单词,在Google里找了半天终于发现了它的含义:Flash Of Unstyled Content。它指的是在某些情况下,IE在加载网页时会出现短暂的CSS样式失效。这种问题出现的条件是比较独特的:
    1. 只发生在Windows上的IE(5.0版本以上)
    2. 只发生在那些会出现FOUC现象的网页
    3. IE的临时文件夹中没有缓存过该页面的CSS文件

    现在用IE访问这个页面,就可以看到FOUC发生的时候的情况(当然前提是你之前没有访问过它,否则可能需要清空IE的临时文件夹再访问)。

    这个页面的特殊之处在于它的<head>标签里是没有任何的<link>或<script>元素的,它只有这样三行代码:
    <title>Flash of Unstyled Content (FOUC)</title> 
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> 
    <style type="text/css" media="all">@import "../fouc.css";</style> 
    而引用CSS文件的@import就是造成这个问题的罪魁祸首。IE会先加载整个HTML文档的DOM,然后再去导入外部的CSS文件,因此,在页面DOM加载完成到CSS导入完成中间会有一段时间页面上的内容是没有样式的,这段时间的长短跟网速,电脑速度都有关系。


    解决方法

    解决方法简单的出奇,只要在<head>之间加入一个<link>或者<script>元素就可以了。

  • 相关阅读:
    解决ecshop进入后台服务器出现500的问题
    Java8新特性(拉姆达表达式lambda)
    使用Optional优雅处理null
    Arrays.asList 存在的坑
    Java提供的几种线程池
    冒泡排序及优化详解
    如何让MySQL语句执行加速?
    关于https的五大误区
    127.0.0.1和0.0.0.0地址的区别
    宽带网络技术-大题重点
  • 原文地址:https://www.cnblogs.com/radom/p/2559299.html
Copyright © 2011-2022 走看看