如果在特定元素中，則忽略 CSS 規則

Question

假設我有一個名為.root的 class，其中包含大量適用於我幾乎所有網站的 CSS 規則。

我還有一些“特殊”元素（包含在.root元素中），但我不想將.root規則應用於.special元素中包含的任何內容。 我不想“覆蓋”所有根規則，只是不應用它們。

是否可以只使用 CSS？

謝謝！

 .root { color: blue; /* Lots of other styles */ }.special { font-weight: bold; }

 <div class="root"> This is blue <div class="special"> <span>This is bold and blue, but I'd like this to be only bold</span> </div> </div>

Answer 1

您可以使用 value property:initial to one property 來獲得該屬性的初始值

或者您可以使用all: initial將選擇器的所有值設置為其初始值

https://developer.mozilla.org/fr/docs/Web/CSS/initial

 .root { color: blue; /* Lots of other styles */ }.special { font-weight: bold; color: initial; }

 <div class="root"> This is blue <div class="special"> <span>This is bold and blue, but I'd like this to be only bold</span> </div> </div>