Attribut media de l'élément <area> en HTML

Définition et utilisation

media L'attribut spécifie pour quels médias ou appareils le document lié a été optimisé.

Cette propriété est utilisée pour définir si l'URL cible est conçue pour des appareils spéciaux (comme iPhone), des médias vocaux ou des médias imprimés.

Cette propriété peut accepter plusieurs valeurs.

Seulement lorsque Attribut href lors de l'utilisation.

Attention :Cet attribut est purement suggératif.

Exemple

Utilisez l'attribut media pour spécifier le média ou l'appareil cible de l'URL cible optimisé :

<map name="planetmap"
  <area shape="rect" coords="0,0,114,576" alt="Sun"
  href="sun.html" media="screen and (min-color-index:256)"
</map>

Essayez-le vous-même

Syntaxe

<area media="valeur>

Opérateurs possibles

Opérateurs Description
and Définit l'opérateur AND.
not Définit l'opérateur NOT.
, Définit l'opérateur OR.

Appareil

Valeur Description
all Par défaut. Convient à tous les appareils.
aural Synthétiseur vocal.
braille Appareil de feedback en braille.
handheld Appareils portables (petit écran, bande passante limitée).
projection Projecteur.
print Mode aperçu avant impression/page d'impression.
screen Écran d'ordinateur.
tty Téléimprimeur et autres supports utilisant une grille de caractères d'épaisseur uniforme.
tv Appareils de type télévision (faible résolution, capacité de pagination limitée).

Valeur

Valeur Description
width

Définit la largeur de la zone cible d'affichage.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (min-width:500px"

height

Définit la hauteur de la zone cible d'affichage.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (max-height:700px"

device-width

Définit la largeur de l'écran cible/papier.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (device-width:500px"

device-height

Définit la hauteur de l'écran cible/papier.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (device-height:500px"

orientation

Définit la direction de l'écran cible/papier.

Valeurs possibles : "portrait" ou "landscape"

Exemple : media="all and (orientation: landscape"

aspect-ratio

Définit le ratio largeur/hauteur de la zone cible d'affichage.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (aspect-ratio:16/9"

device-aspect-ratio

Définit le ratio device-width/device-height pour l'écran cible/papier.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (aspect-ratio:16/9"

color

Définit le nombre de bits par couleur pour l'écran cible.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (color:3"

color-index

Définit le nombre de couleurs que peut gérer l'écran cible.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (min-color-index:256"

Monochrome

Définir le nombre de bits par pixel dans le tampon de couleur monochrome.

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="screen and (monochrome:2)"

Résolution

Définir la densité en pixels de l'écran cible/papier (dpi ou dpcm).

Préfixes "min-" et "max-" peuvent être utilisés.

Exemple : media="print and (resolution:300dpi)"

Balayage

Définir la méthode de balayage de l'écran TV.

Valeurs possibles : "progressive" et "interlace".

Exemple : media="tv and (scan:interlace)"

Grille

Définir l'appareil de sortie en grille ou en bitmap.

Valeurs possibles : "1" représente la grille, "0" est autre.

Exemple : media="handheld and (grid:1)"

Support du navigateur

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support