Definizione e utilizzo
Il media attributo specifica ciò che i media / dispositivo del documento collegato è ottimizzato per.
Questo attributo viene utilizzato per specificare che l'URL di destinazione è progettata per i dispositivi speciali (come iPhone), discorso o supporti di stampa.
Questo attributo può accettare più valori.
Si applica a
Il media attributo può essere utilizzato sui seguenti elementi:
| Elementi | Attributo |
|---|---|
| <a> | media |
| <area> | media |
| <link> | media |
| <source> | media |
| <style> | media |
Esempi
A esempio
Un collegamento con un media di attributo:
<a href="att_a_media.asp?output=print"
media="print and (resolution:300dpi)">
Open media attribute page for print.</a>
Prova tu stesso " Area Esempio
Un'immagine-map, con superficie cliccabile:
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun"
href="sun.htm" media="screen and (min-color-index:256)">
</map>
Prova tu stesso " Link Esempio
Due fogli di stile diversi per i due tipi di media diversi (schermo e di stampa):
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>
Prova tu stesso " Source Esempio
Utilizzare dei media attributi:
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Prova tu stesso " Style Esempio
Specificare lo stile da utilizzare per la stampa:
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style> Prova tu stesso " Supporto per il browser
Il media attributo ha la seguente supporto del browser per ogni elemento:
| Elemento | |||||
|---|---|---|---|---|---|
| a | sì | sì | sì | sì | sì |
| area | sì | sì | sì | sì | sì |
| link | sì | sì | sì | sì | sì |
| source | Non supportato | Non supportato | Non supportato | Non supportato | Non supportato |
| style | sì | sì | sì | sì | sì |