Attribut media de source

Objet Source du DOM HTML

Définition et utilisation

media Définir ou retourner la valeur de l'attribut media de l'élément <source>.

Attribut media du balise <source> Définir le type de ressource média (quels médias / appareils sont optimisés pour le fichier).

Le navigateur peut utiliser la propriété media pour déterminer s'il peut lire le fichier. S'il ne peut pas, il peut choisir de ne pas télécharger.

Manuel de référence HTML :Balise <source> HTML

Exemple

Retourner quels fichiers sont optimisés pour quels médias / appareils :

var x = document.getElementById("mySource").media;

Essayez-le vous-même

Syntaxe

Retourner la propriété media :

sourceObject.media

Définir la propriété media :

sourceObject.media = value

Remarque :Cette propriété peut accepter plusieurs valeurs.

Opérateurs possibles

Valeur Description
and Opérateur ou symbole AND.
not Opérateur ou symbole NOT.
, Opérateur ou symbole.

Appareil

Valeur Description
all Applicable à tous les appareils. Par défaut.
aural Synthétiseur vocal.
braille Appareil de retour d'information en braille.
handheld Appareils portables (écran de petite taille, bande passante limitée).
projection Projecteur
print Mode aperçu avant impression / page d'impression.
screen Écran d'ordinateur.
tty Machines à écrire télégraphiques à grille de caractères espacés fixes et médias similaires.
tv Appareils de type télévision (résolution basse, capacité de défilement limitée).

Valeur de l'attribut

Valeur Description
width

Définir la largeur de la zone de visualisation cible.

Il est possible d'utiliser les préfixes "min-" et "max-".

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

Définir la hauteur de la zone de visualisation cible.

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Les valeurs possibles sont "portrait" ou "landscape".

Exemple : media="all and (orientation: landscape)"
aspect-ratio

Définir le rapport largeur/hauteur de la zone de visualisation cible.

Il est possible d'utiliser les préfixes "min-" et "max-".

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

Définir le rapport largeur/hauteur de l'écran cible/papier.

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Il est possible d'utiliser les préfixes "min-" et "max-".

Exemple : media="screen and (color:3)"
color-index

Définir le nombre de couleurs que l'écran cible peut traiter.

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Il est possible d'utiliser les préfixes "min-" et "max-".

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

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

Il est possible d'utiliser les préfixes "min-" et "max-".

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

Définir la méthode de numérisation de l'écran de télévision.

Les valeurs possibles sont "progressive" et "interlace".

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

Définir l'appareil de sortie est un "grid" ou un "bitmap".

Les valeurs possibles pour le "grid" sont "1", sinon "0".

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

Détails techniques

Valeur de retour : Valeur en chaîne, indiquant le type de ressource média.

Support du navigateur

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

Remarque :Cependant, aucun navigateur principal ne prend en charge l'attribut media HTML.

Pages associées

Manuel de référence HTML :Attribut media du balise <source> HTML

Objet Source du DOM HTML