Nella lezione precedente abbiamo accennato all'attributo media. Grazie ad esso siamo in grado di impostare un foglio di stile per ogni supporto su cui la nostra pagina verrà distribuita. Una possibilità davvero interessante e che andrà sempre più diffondendosi con l'ampliarsi dei mezzi di diffusione delle pagine (X)HTML.

Dove prima c'era unicamente un browser, domani potranno sempre più esserci palmari, cellulari e altri dispositivi. Per non parlare dei software usati da disabili come i browser vocali. Ciascuno di questi supporti presenta caratteristiche diverse in termini di memoria, ampiezza dello schermo e funzionalità. Riuscire ad adattare uno stile unico a tutti è praticamente impossibile, oltre che controproducente. La soluzione ideale sta quindi nella creazione di fogli di stile ad hoc.

Sintassi

L'attributo media può accompagnare sia l'elemento che l'elemento

 

 

 

', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Rosso scuro
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Rosso
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Arancione
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Marrone
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Giallo
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Verde
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Oliva
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Ciano
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Blu
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Blu scuro
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Indigo
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Viola
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Bianco
', '');selectWysiwyg(this, 'color');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Nero

', '

');selectWysiwyg(this, 'other');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">sinistra
', '

');selectWysiwyg(this, 'other');return false;" onmouseover="this.className='selectHover';" onmouseout="this.className='';">Centrato
', '