Manuale di riferimento HTML

Completo elenco dei tag HTML

Attributo media style HTML

L'attributo media specifica quale tipo di media o dispositivo è ottimizzato lo stile CSS, questo attributo viene utilizzato per specificare lo stile utilizzato per dispositivi speciali (ad esempio iPhone), media vocali o stampati.

　HTML <style> etichetta

Esempio online

Specificare lo stile utilizzato per la stampa:

Esempio

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Utilizzo dell'attributo media source HTML - Tutorial di base (oldtoolbag.com)</title>
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
</head>
<body>
<h1>oldtoolbag.com Esempio</h1>
<p>Se stampi questa pagina o l'apri in anteprima di stampa, vedrai che utilizza lo stile di tabella media = "print" per la configurazione dello stile. Lo stile di "stampa" contiene testo nero su sfondo bianco.</p>
</body>
</html>

Testa per vedere ‹/›

Compatibilità del browser

IEFirefoxOperaChromeSafari

Tutti i browser mainstream supportano l'attributo media.

Definizione e uso

L'attributo media specifica quale tipo di media/dispositivo il stile CSS è ottimizzato
Questa proprietà viene utilizzata per specificare lo stile utilizzato per dispositivi speciali (ad esempio iPhone), media vocali o stampati.
Suggerimento: questa proprietà può accettare più valori.

Differenze tra HTML 4.01 e HTML5

Nessuna.

Sintassi

<style media="value>

Operatori possibili

Valore	Descrizione
and	Specificare l'operatore AND
not	Specificare l'operatore NOT
,	Specificare l'operatore OR

Dispositivo

Valore	Descrizione
all	Predefinito. Si adatta a tutti i dispositivi
aural	Sintetizzatore vocale
braille	Dispositivi di feedback in braille per non vedenti
handheld	Dispositivi portatili (schermo piccolo, banda larga limitata)
projection	Proiettore
print	Anteprima di stampa / pagina di stampa
screen	Schermo del computer (valore predefinito)
tty	Teletipo e altri media con griglia di caratteri a larghezza fissa
tv	Dispositivi di tipo TV (bassa risoluzione, capacità di scorrimento limitata del display)

Valore

Valore	Descrizione
width	Specificare la larghezza dell'area di visualizzazione del display target È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (min-width:500px)"
height	Specificare l'altezza dell'area di visualizzazione del display target È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (max-height:700px)"
device-width	Specificare la larghezza del display target/pagina È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (device-width:500px)"
device-height	Specificare l'altezza del display target/pagina È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (device-height:500px)"
orientation	Specificare la direzione del display target/pagina Valori possibili: "portrait" o "landscape" Esempio: media="all and (orientation: landscape)"
aspect-ratio	Specificare il rapporto larghezza/altezza dell'area di visualizzazione del display target È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio	Specificare il rapporto device-width/device-height del display target/pagina È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (aspect-ratio:16/9)"
color	Specificare i bits/color del display target È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (color:3)"
color-index	Specificare il numero di colori che il display target può gestire. È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (min-color-index:256)"
monochrome	Specificare i bits/pixel del buffer di frame monocromatico. È possibile utilizzare prefissi "min-" e "max-". Esempio: media="screen and (monochrome:2)"
resolution	Specificare la densità di pixel (dpi o dpcm) del display/pagina target. È possibile utilizzare prefissi "min-" e "max-". Esempio: media="print and (resolution:300dpi)"
scan	Specificare il metodo di scansione del display TV. Valori possibili: "progressive" e "interlace". Esempio: media="tv and (scan:interlace)"
griglia	Specificare se l'output del dispositivo è una griglia o bitmap. Valori possibili: "1" per griglia, altrimenti "0". Esempio: media="handheld and (grid:1)"

　HTML <style> etichetta

HTML: <template> etichetta