Как заставить работать CSS-правило?

Question

[MrSusua]

Добрый день!

Есть следующий HTML-код:

<p>Blah <span>WORLD</span> blah blah <span>WORLD</span> blah</p>

Как заставить работать это правило:

p :not(span) {
    color: red;
}

Чтобы текст в параграфе стал красным везде, кроме дочерних элементов (span)?

Вариант представленный ниже НЕ подходит (нужно именно через селектор :not()):

p {
    color: red;
}

p * {
    color: black;
}

Answer 1

[Евгений]

p {
    color: #f00;
}

p > span {
    color: #000;
}

Answer 2

[Mr Crabbz]

p *:not(span) {
    color: red;
}

Comments

[MrSusua]

Нет конечно. Это не работает.

Answer 3

[Антон Федорян]

p
{
  color: red;
}

p span:not([class])
{
  color: black;
}

Answer 4

[Антон Нагаец]

Пример

body{
color:red;
}
p > :not(p){
    color: black;
}

Вы декларируете общий стиль на блок. После с помощью :not вы исключаете или переназначаете css правила для тех кто находится внутри блока ( Классы, чистые теги)

Answer 5

[L0k1]

именно через :not - это условие задачки?

*{
  color: black;
}
:not(span){
  color: red;
}