在除一個之外的所有子元素上分層應用 CSS

Question

我有這個 CSS 規則：

.x-pp-plan , .x-pp-plan * {
  font: normal normal normal 15px/120% Arial;
  color: #666;
}

與此組件層次結構相關：

如何將此樣式應用於所有組件 (*) 除了.performance-component ？

我已經嘗試過*:not(.performance-component)但它不起作用。

Answer 1

刪除 class 並嘗試給它一個 id="yourID" 然后像這樣給它你想要的樣式

#yourID{ 所需的 styles }

這不是更有經驗的開發人員會推薦的，但它可以快速解決您的問題

Answer 2

為您希望以不同方式設置樣式的 div 添加單獨的樣式聲明。 此外，您不需要.x-pp-plan * ，因為.x-pp-plan -pp-plan 的所有子級都應該已經繼承父級的 styles。

.x-pp-plan {
  font: normal normal normal 15px/120% Arial;
  color: #666;
}

.x-pp-plan .perfomance-component {
  font: 'Comic Sans';
  color: red;
}