bodyの中のlinkタグでロードされるCSSファイルによる一瞬画面変化を避ける方法
方法
ロードする間表示用ページを用意します。 styleタグの中のコードでローディングデザインを出す。 ロードされるCSSの中でローディングデザインを隠す。
index.html
<!doctype html/> <html> <head> <meta charset="utf-8" /> <style> .loading { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: gray; } </style> </head> <body> <style> .loading { display: block; } </style> <link rel="stylesheet" href="style.css"> <div class="loading"> Loading... </div> <div class="content"> Content </div> </body> </html>
style.css
.loading { display: none !important; }