Применить правило CSS ко всем элементам, кроме одного с дочерними элементами

Question

У меня есть CSS правило:

* {
  font-family: Tahoma;
}  

Я хочу применить правило ко всем элементам, кроме этого div, уникального для класса и его потомков:

<div class="angular-text-editor">
    <p></p>
    <p></p>
    <p></p>
</div>

семейство шрифтов для этого div и его дочерних элементов должно быть выбрано пользователем, но теперь из-за примененного правила * новый выбранный шрифт не может быть применен к ним, даже с! Важным.

Мне нужно какое-то правило css, которое гарантирует, что правило * будет применяться ко всем элементам, кроме этого div и его дочерних элементов.

Я даже пытался использовать селектор :not, но это не помогло с дочерними элементами. .

спасибо

Answer 1

Выберите уникальный div с его потомками и назначьте им другой font-family

* {
  font-family: sans-serif;
}

.a, .a * {
  font-family: monospace;
}

<div class="a">
   first text
   <p>more text</p>
   <div>
      further nested text
      <p>more text</p>
   </div>
</div>
<div>
   second text
   <p>more text</p>
</div>

Или присвойте font-family тегу body и используйте unset для уникального элемента, inherit для его потомков.

.a {
  font-family: unset;
}

.a * {
  font-family: inherit !important;
}

body *:not(.a) {
  font-family: sans-serif;
}

body {
  font-family: monospace;
}

<div class="a">
   first text
   <p>more text</p>
   <div>
      further nested text
      <p>more text</p>
   </div>
</div>
<div>
   second text
   <p>more text</p>
</div>

Answer 2

я изменил правило css на это:

body {
 font-family: Tahoma !important;
}

, поэтому все элементы унаследуют его, если у них нет своих ... особенное спасибо этому человеку:

Применение одного шрифта ко всему сайту с помощью CSS