Le parentesi sono consentite nei selettori CSS?

Nell’esempio seguente, voglio creare una regola CSS che si applica solo all’intestazione con il testo “Blockhead”.

Blockhead

Clay rules

Posso usare parentesi, come (.gumby > .pokey) + h3 ? In caso contrario, qual è la mia alternativa?

No, le parentesi non sono operatori validi nei selettori CSS. Sono riservati per le notazioni funzionali, come ad esempio :lang() :not() e :nth-child() .

Non hai comunque bisogno di loro; .gumby > .pokey + h3 per sé funzionerà bene.

Questo perché una sequenza di selettori e combinatori viene sempre letta linearmente . I combinatori non hanno alcun tipo di precedenza. Il selettore può essere interpretato come

Seleziona un elemento h3
che segue immediatamente un elemento con un pokey class
questo è un figlio di un elemento con la gumby class.

E a causa di come funzionano gli alberi dei nodes, l’uso di combinatori tra fratelli e figli implica che sia .pokey che h3 sono figli di .gumby , che nel tuo caso lo sono, a causa della sua affermazione che entrambi sono fratelli.

h3 non è all’interno di .pokey quindi devi omettere .pokey dalla regola

Tutto quello che potresti fare è

 .gumby h3 {} 

o fai questo

  

Blockhead

Clay rules

.gumby.pokey h3 {}

se un tag ha più di una class, puoi accumularli in css se non usi uno spazio