當(dāng)我們在瀏覽器中打開一個網(wǎng)頁時，通常會先加載 HTML 網(wǎng)頁，然后再加載 CSS 樣式文件，最后加載 JavaScript 文件。這個過程需要一定的時間，用戶在等待期間可能會感到不耐煩，甚至?xí)x開網(wǎng)頁。
為了提高用戶體驗，我們可以讓 CSS 在網(wǎng)頁加載時立即執(zhí)行，這樣可以讓網(wǎng)頁更快地呈現(xiàn)出來。具體實(shí)現(xiàn)方法如下：
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>立即執(zhí)行 CSS</title><style>body {
display: none; // 先將網(wǎng)頁內(nèi)容隱藏起來
}
</style><script>window.onload = function() {
var body = document.getElementsByTagName('body')[0];
body.style.display = 'block'; // 網(wǎng)頁內(nèi)容加載完成后再顯示出來
}
</script></head><body><h1>立即執(zhí)行 CSS</h1><p>這是一個測試頁面，用于演示如何讓 CSS 在加載時立即執(zhí)行。</p></body></html>上面的代碼中，我們先在 style 標(biāo)簽中將 body 元素的 display 屬性設(shè)置為 none，這樣網(wǎng)頁內(nèi)容就被隱藏了起來。在 script 標(biāo)簽中，我們使用 window.onload 事件，當(dāng)網(wǎng)頁加載完成后，將 body 元素的 display 屬性設(shè)置為 block，這樣網(wǎng)頁內(nèi)容就可以顯示出來了。
總之，讓 CSS 在網(wǎng)頁加載時立即執(zhí)行可以提高用戶體驗，讓網(wǎng)頁更快地呈現(xiàn)出來。通過上面的實(shí)例代碼，您也可以輕松實(shí)現(xiàn)此功能。