1. CSS doit être placé au-dessus de la structure (généralement placé dans l'élément head). CSS est un langage interprété, et Firefox et IE ne rendront rien tant qu'ils n'auront pas attendu la fin du transfert CSS. Ce n'est qu'en ajoutant CSS que la page peut être rendue lorsque le navigateur analyse la structure.
Exemple de code source :
Cela provoque le problème d'écran blanc vide. La page est totalement vide jusqu'à ce que la feuille de style en bas soit téléchargée, de l'ordre de 6 à 10 secondes pour cette page. Le navigateur attend que la feuille de style soit chargée avant d'afficher autre chose. la page, même le texte statique.
Le problème qui en résulte est que la page sera « simple » pendant un certain temps, puis soudainement à nouveau « magnifique », ce qui se traduira par une très mauvaise expérience utilisateur.
2. Essayez d'utiliser la méthode d'importation de style <link rel="stylesheet" href="http://www.cnwebshow.com/123.css" type="text/css"> et réduisez l'utilisation de @import, encore moins Utilisez plusieurs niveaux de @import imbriqués. Parce que dans IE, @import équivaut à placer <link> à la fin de la page.
Exemple de code source
Il s'agit d'une syntaxe valide, mais, même si elle se trouve dans le HEAD du document, elle interrompt le rendu progressif et provoque à la place un écran blanc vide et un flash de Unstyled.