Types de médias CSS
Types de média CSS
Les types de média 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 sont conçues uniquement 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 ! Si vous imprimez cette page en utilisant Mozilla/Firefox ou IE5+, vous verrez "Types de médias". " sera affiché en utilisant une autre police 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.
Type de média .
aural utilisé pour les synthétiseurs vocaux et audio.
le braille est un dispositif de retour tactile en braille destiné aux personnes aveugles.
Imprimante braille en relief pour la pagination.
ordinateur de poche Pour les petits appareils portables. .
la projection est utilisée pour la présentation de projets, comme les diapositives. .
tty est utilisé pour les médias qui utilisent une grille de lettres à densité fixe, tels que les téléscripteurs et les terminaux.
télévision à utiliser pour les appareils de type téléviseur.
![Projet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]](https://img.php.cn/upload/course/000/000/068/63bfcb2974f91471.jpg)
![Cours frontal base zéro [Vue apprentissage avancé et application pratique]](https://img.php.cn/upload/course/000/000/068/63bbd15353895588.jpg)
![Tutoriel WEB front-end [HTML5+CSS3+JS]](https://img.php.cn/upload/course/000/000/068/63ba60c8da520536.jpg)
![Application pratique Apipost [api, interface, tests automatisés, mock]](https://img.php.cn/upload/course/000/000/068/63b3c967a20f4861.jpg)
