瀏覽器如何查找和呈現CSS規則

Question

假設我們有一個頁面，其中包含一些簡單的HTML / CSS，如下所示。 瀏覽器是否還在樣式表中讀取.b和.c ？

HTML

<div class="a">1</div>
<div>2</div>
<div>3</div>

CSS

.a { color: aqua; }
.b { color: blue; }
.c { color: cyan; }

這只是一個例子，但在現實世界中可能有數百，數千行CSS代碼未被使用，例如使用Bootstrap用於非常小的項目。

Answer 1

是的，所有規則都被加載到內存中，這就是為什么當你向DOM添加新元素時（例如，通過使用javascript），你會看到樣式自動應用於它們。