Was bedeutet der CSS-Selektor ">" (Größer-als-Zeichen)?

Question

Zum Beispiel:

div > p.some_class {
  /* Some declarations */
}

Was genau bedeutet die > Zeichen bedeuten?

Answer 1

Alle p Tags mit Klasse some_class die direkte Kinder einer div Tag.

Answer 2

Html

<div>
    <p class="some_class">lohrem text (it will be of red color )</p>    
    <div>
        <p class="some_class">lohrem text (it will  NOT be of red color)</p> 
    </div>
    <p class="some_class">lohrem text (it will be  of red color )</p>
</div>

css

div > p.some_class{
    color:red;
}

Alle direkten Kinder, die <p> con .some_class würde der Stil auf sie angewendet werden.

Answer 3

Der Selektor mit dem Größer-Zeichen ( > ) in CSS bedeutet, dass der Selektor auf der rechten Seite ein direkter Nachkomme / Kind des Selektors auf der linken Seite ist.

Ein Beispiel:

article > p { }

Bedeutet, dass nur ein Absatz, der auf einen Artikel folgt, formatiert wird.