CSS Universal Selektor (*) Spezifität

Question

Ich versuche herauszufinden, warum .x höhere Spezifität als *.x hat, wenn der letztere erwartet wird zu gewinnen.

Ist das nicht *.x soll eine Spezifität von 0-0-1-1 (1 Klasse, 1 Tag) haben, während .x ist nur eine einzige Klasse 0-0-1-0?

Betrachten Sie den folgenden grundlegenden Code:

*.x { color: blue; } 
 

 
.x { color: red }

<p class="x">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque, nam.</p>

Es sollte blau sein. Um ein erwartetes Verhalten zu zeigen, ich ersetzt * mit einem anderen Element (p):

p.x { color: blue; } 
 

 
.x { color: red }

<p class="x">This time it works.</p>

Answer 1

Die universal selector (*) hat keinen Einfluss auf die Spezifität, also der die Arten letztere Wähler werden diejenigen sein, die werden angewendet.

Ein Sternchen (*) ist der universelle Selektor für CSS. Es entspricht einem einzelnen Element eines beliebigen Typs. Das Auslassen des Sternchens mit einfachen Selektoren hat den gleichen Effekt. Zum Beispiel werden * .warning und .warning als gleich betrachtet.