Attribut media <a> HTML
Définition et utilisation
media L'attribut spécifie pour quels médias ou appareils le document lié est optimisé.
Cette propriété est utilisée pour spécifier si l'URL cible est conçue pour des appareils spécifiques (comme iPhone), pour le speech ou pour les médias imprimés.
Cette propriété peut accepter plusieurs valeurs.
Ne peut être utilisé que Attribut href Utilisée lorsque présente.
Attention :Cette propriété est purement indicative.
Exemple
Lien définissant l'attribut media :
<a href="att_a_media.asp?output=print" media="print and (resolution:300dpi)"> Ouvrez la page des attributs media dédiée à l'impression </a>
Syntaxe
<a 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. Adapté à tous les appareils. |
| aural | Synthétiseur vocal. |
| braille | Appareil de feedback en braille. |
| handheld | Appareils portables (petit écran, bande passante limitée). |
| projection | Projecteur. |
| Mode aperçu avant impression/page d'impression. | |
| screen | Écran d'ordinateur. |
| tty | Téléimprimeur et autres médias utilisant une grille de caractères à largeur fixe. |
| tv | Appareils de type télévision (résolution faible, capacité de pagination limitée). |
Valeur
| Valeur | Description |
|---|---|
| width |
Définit la largeur de la zone de visualisation cible. Préfixes "min-" et "max-" peuvent être utilisés. Exemple : media="screen and (min-width:500px" |
| height |
Définit la hauteur de la zone de visualisation cible. 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 rapport largeur/hauteur de la zone de visualisation cible. Préfixes "min-" et "max-" peuvent être utilisés. Exemple : media="screen and (aspect-ratio:16/9" |
| device-aspect-ratio |
Définit le rapport largeur/hauteur device-width/device-height de 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 pour chaque couleur de 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éfinit le nombre de bits par pixel dans le tampon d'image monochrome. Préfixes "min-" et "max-" peuvent être utilisés. Exemple : media="screen and (monochrome:2)" |
| résolution |
Définit la densité en pixels de l'écran/papier cible (dpi ou dpcm). Préfixes "min-" et "max-" peuvent être utilisés. Exemple : media="print and (resolution:300dpi)" |
| scan |
Définit la méthode de balayage de l'écran TV. Les valeurs possibles sont : "progressive" et "interlace". Exemple : media="tv and (scan:interlace)" |
| grille |
Définit l'appareil de sortie est une grille ou un 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 |
