CSS Types de médias


Les types de médias vous permettent de spécifier comment un document sera présenté sur différents médias. Le document peut être affiché de différentes manières à l'écran, sur papier ou dans des navigateurs audio, etc.


Types de médias

Certaines propriétés CSS sont conçues uniquement pour certains médias. Par exemplevoice-familyLa propriété est conçue spécifiquement pour les agents utilisateurs audio. D'autres propriétés peuvent être utilisées pour différents types de médias. Par exemple,font-sizeCette propriété peut être utilisée pour les médias écran et impression, mais avec des valeurs différentes. Les documents à l'écran et sur papier diffèrent, nécessitant généralement une police plus grande,sans-serifLes polices sont plus adaptées à la lecture à l'écran, tandis que les policesserifles polices sont plus faciles à lire sur papier.


Règle @media

La règle @media permet de définir différents styles pour différents médias dans la même feuille de style.

L'exemple suivant demande au navigateur d'afficher un style de police Verdana de 14 pixels à l'écran. Mais si la page est imprimée, ce sera une police Times de 10 pixels. Notez que font-weight est défini sur gras à la fois à l'écran et sur papier :

Exemple

@media screen { p.test {font-family:verdana,sans-serif;font-size:14px;} } @media print { p.test {font-family:times,serif;font-size:10px;} } @media screen,print { p.test {font-weight:bold;} }

Essayez-le vous-même »

Vous pouvez l'essayer vous-même !Si vous utilisezMozilla / FirefoxOu imprimez cette page avec IE5+, et vous verrez que le type de média s'affiche avec une police légèrement plus petite que le reste du texte.


Autres types de médias

Remarque :Les noms des types de médias ne sont pas sensibles à la casse.

Types de médias Description
all Utilisé pour tous les appareils média.
aural Utilisé pour les synthétiseurs vocaux et audio.
braille Utilisé pour les appareils de retour tactile Braille pour les aveugles.
embossed Utilisé pour les imprimantes Braille paginées pour les aveugles.
handheld Utilisé pour les petits appareils portables.
print Utilisé pour les imprimantes.
projection Utilisé pour les présentations, telles que les diapositives.
écran Utilisé pour les moniteurs d'ordinateur.
tty Utilisé pour les supports avec une grille de caractères à densité fixe, tels que les téléscripteurs et les terminaux.
tv Utilisé pour les appareils de type télévision.
autres extensions