Page 73 - Guida tascabile HTML5

media="print and (resolution:300dpi)"
media="all and (max-width:600px)"

RIFERIMENTO Un’appendice del manuale è dedicata a un approfondimento sulle
media query.

Il tag <a> e gli elementi nidificati

La regola generale prevede che i tag inline non contengano, nidificati al loro

interno, elementi di blocco. Il tag <a> fa eccezione consentendo la definizione di
strutture più complesse.

Per esempio è possibile inserire all’interno di un tag <a> un’immagine (elemento

inline) o interi <div>:

<a href="esempio.html"><img src="fotografia.jpg"></a>

Questo markup renderà attiva l’immagine, consentendo all’utente di fare clic su
di essa per passare al documento collegato.

<a href="esempio.html">
<div>
(un contenuto strutturato)
</div>
</a>
In questo caso sarà attiva, e risponderà alle interazioni dell’utente, tutta l’area

occupata dal <div>.

TERMINOLOGIA La possibilità di “avvolgere” elementi di blocco con il tag <a> è stata
introdotta con la specifica HTML5, per venire incontro alle necessità degli sviluppatori

web, prima costretti a ricorrere a funzioni JavaScript per ottenere il comportamento
desiderato rispettando le regole della sintassi HTML.

NOTA Tenete presente che, tramite adeguate regole CSS, è comunque sempre
possibile intervenire sull’aspetto degli elementi, facendo sì che il browser visualizzi i tag
inline come block e viceversa.

La differenza tra percorsi relativi e assoluti

Come già sottolineato, l’attributo fondamentale del tag <a> è href, che specifica

l’indirizzo di destinazione del link ipertestuale.

ATTENZIONE Le osservazioni fatte in questo paragrafo valgono per tutti gli altri
attributi che riguardano la manipolazione degli URL, come per esempio src utilizzato
con il tag <img>: tenetele in considerazione quando avete la necessità di creare un
riferimento a una qualsiasi risorsa in Rete.