Attribut media HTML
Définition et Utilisation
L'attribut media spécifie pour quel type de média ou appareil le document lié est optimisé.
Cet attribut est utilisé pour indiquer que l'URL cible est conçue pour des appareils spécifiques (comme l'iPhone), des médias de discours ou d'impression.
Cet attribut peut accepter plusieurs valeurs.
S'applique à
L'attribut media peut être utilisé sur les éléments suivants :
| Éléments | Attribut |
|---|---|
| <a> | media |
| <area> | media |
| <link> | media |
| <source> | media |
| <style> | media |
Exemples
Exemple
Un lien avec un attribut media :
<a href="att_a_media.asp?output=print"
media="print and (resolution:300dpi)">
Ouvrir la page de l'attribut media pour l'impression.</a> Exemple de Zone
Une carte d'image avec une zone cliquable :
<img src="planets.gif" width="145" height="126" alt="Planètes" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Soleil"
href="sun.htm" media="screen and (min-color-index:256)">
</map> Exemple de Lien
Deux feuilles de style différentes pour deux types de médias (écran et impression) :
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head> Exemple de Source
Utilisation de l'attribut media :
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)"> Exemple de Style
Spécifiez le style à utiliser pour l'impression :
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style> Support des Navigateurs
L'attribut media est pris en charge par les navigateurs suivants pour chaque élément :
| Élément | |||||
|---|---|---|---|---|---|
| a | Oui | Oui | Oui | Oui | Oui |
| area | Oui | Oui | Oui | Oui | Oui |
| link | Oui | Oui | Oui | Oui | Oui |
| source | Non supporté | Non supporté | Non supporté | Non supporté | Non supporté |
| style | Oui | Oui | Oui | Oui | Oui |