1. CSS は構造体の上に配置する必要があります (通常は head 要素内に配置されます)。 CSS はインタープリタ言語であり、Firefox と IE は CSS 転送が完了するまで何も表示しません。 CSS を先頭に追加することによってのみ、ブラウザーが構造を解析するときにページをレンダリングできます。
ソースコードの例:
これにより、画面が真っ白になるという問題が発生します。このページの下部にあるスタイルシートがダウンロードされるまで、ブラウザはスタイルシートがロードされるのを 6 ～ 10 秒ほど待ってから、他のものが表示されます。ページ、静的テキストも含めて。
その結果、ページがしばらくは「シンプル」になり、突然「ゴージャス」になり、ユーザー エクスペリエンスが非常に低下するという問題が発生します。
2. スタイルのインポート方法を使用し、@import の使用を減らします。ましてや、複数レベルのネストされた @import を使用することはできません。 IE では、@import はページの最後に を配置することと同じであるためです。
ソースコードの例
これは有効な構文ですが、ドキュメントの HEAD にあるにもかかわらず、プログレッシブ レンダリングが中断され、代わりに空白の白い画面とスタイルのないフラッシュが表示されます。