Come viene utilizzato il carattere "maggiore di" o ">" nei CSS?

Ho visto questo personaggio diverse volte nei file CSS, ma non ho idea di come sia stato usato. Qualcuno può spiegarmelo e mostrare come sono utili nel rendere più semplice uno stile di pagina?

È un selettore figlio CSS. P > SPANsignifica applicare lo stile che segue a tutti i tag SPAN che sono figli di un Ptag.

Nota che "figlio" significa "discendente immediato", non solo qualsiasi discendente. P SPANè un selettore discendente che applica lo stile che segue a tutti i SPANtag che sono figli di un Ptag o figli ricorsivi di qualsiasi altro tag che è figlio / discendente di un Ptag. P > SPANsi applica solo ai SPANtag che sono figli di un Ptag.

p em

corrisponderà a quelli <em>che si trovano all'interno di a <p>. Ad esempio, corrisponderebbe alle seguenti <em>s:

<p><strong><em>foo</em></strong></p>
<p>Text <em>foo</em> bar</p>

D'altro canto,

p > em

Corrisponderà solo a <em>s che sono figli immediati di <p>. Quindi abbinerà:

<p>Text <em>foo</em> bar</p>

Ma no:

<p><strong><em>foo</em></strong></p>

questo è noto come un bambino combinatore:

È stato aggiunto un selettore combinatore figlio per poter modellare il contenuto degli elementi contenuti in altri elementi specificati. Ad esempio, supponiamo che si desideri impostare il bianco come colore dei collegamenti ipertestuali all'interno dei tag div per una determinata classe perché hanno uno sfondo scuro. Ciò può essere realizzato utilizzando un punto per combinare div con le risorse della classe e un segno maggiore di come un combinatore per combinare la coppia con un, come mostrato di seguito:

div.resources > a{color: white;}

(da http://www.xml.com/pub/a/2003/06/18/css3-selectors.html )

E > F

Corrisponde a qualsiasi elemento F che è figlio di un elemento E.

di più su http://www.w3.org/TR/CSS21/selector.html#child-selectors