Types de médias CSS

Les types de médias vous permettent de spécifier comment le fichier sera rendu dans différents médias. Le fichier peut être affiché de différentes manières à l'écran, sur papier, dans un navigateur auditif, etc.

Type de média

Certaines propriétés CSS ne sont conçues que pour certains médias. Par exemple, l'attribut « voice-family » est conçu pour entendre les agents utilisateurs. Plusieurs autres propriétés sont disponibles pour différents types de médias. Par exemple, l'attribut "font-size" peut être utilisé pour les supports d'écran et d'impression, mais avec des valeurs différentes. Les documents à l'écran et sur papier sont différents et nécessitent généralement une police plus grande. Les polices sans empattement sont meilleures pour la lecture à l'écran, tandis que les polices avec empattement 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 ci-dessous nous indique d'afficher un style de police Verdana de 14 pixels sur l'écran du navigateur. Mais si la page s’imprime, elle sera en police Times de 10 pixels. Veuillez noter que le poids de la police est défini en gras à l'écran et sur papier :

<html>
<head>
<style>
@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;}
}
</style>
</head>

<body>
....
</body>
</html>

Vous pouvez l'essayer vous-même et voir Imprimez cette page si vous utilisez Mozilla/Firefox ou IE5+ ! , vous verrez que "Type de support" sera affiché en utilisant une autre police légèrement plus petite que l'autre taille de police du texte.

Autres types de médias

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

媒体类型	描述
all	用于所有的媒体设备。
aural	用于语音和音频合成器。
braille	用于盲人用点字法触觉回馈设备。
embossed	用于分页的盲人用点字法打印机。
handheld	用于小的手持的设备。
print	用于打印机。
projection	用于方案展示，比如幻灯片。
screen	用于电脑显示器。
tty	用于使用固定密度字母栅格的媒体，比如电传打字机和终端。
tv	用于电视机类型的设备。

Types de médias CSS