Introduzione ai CSS - HTML5 con CSS e JavaScript - page 79

cifiche, che si ha una compatibilità più diffusa di queste specifiche, tale da poter parlare
tranquillamente di queste caratteristiche.
I selettori di gerarchia
Iniziamo a dare uno sguardo al più semplice dei selettori, quello che consente di identifica-
re un tag utilizzando una gerarchia. Diamo un'occhiata al codice dell'esempio 4.15 .
Esempio 4.15 - HTML
<p>Esempio di un paragrafo
<span>con dentro
<strong>un altro tag</strong></span></p>
<div>
<section>
<p>Contenuto</p>
</section>
</div>
Esempio 4.15 - CSS
p strong {
color: red;
}
div * p {
background: yellow;
}
Il primo selettore ha l'effetto di recuperare tutti i tag strong all'interno del tag p , anche
annidati eventualmente in altri tag. Attraverso la seconda sintassi, invece, indichiamo che
vogliamo recuperare un tag p che sia contenuto all'interno di un altro (o più) tag posto
all'interno del tag div . La combinazione di questi elementi consente di identificare in ma-
niera precisa dei tag contenuti all'interno di altri tag e, in combinazione con i selettori di
pseudo-classi e pseudo-elementi, consente di specificare con una precisione molto elevata
come formattare un dato elemento, senza necessità di intervenire all'interno del markup.
Questa caratteristica è molto importante quando il contenuto è generato in automatico, per
esempio, perché siamo in presenza di un contenuto inserito con un CMS (Content Mana-
gement System, sistema di gestione dei contenuti).