Définition de la css media

Propriété css : media

Détails des versions feuilles de style css media
css2
Détails de compatiblilité de la feuilles de style css media pour les navigateurs
Netscape 6+
Internet Explorer 4+
Mozilla + et Firefox +
Safari 1 +
Internet Explorer 7+

Définition de media

La règle de feuille de style css @media permet de créer d'autres propriétés pour divers supports appelé aussi média (print, screen) au sein d'une même feuille de style.
Exemple de code :
<style type="text/css">
div {font-size;12px;}
@media{
  div { color:red;}
}
</style>

On peut spécifier le ou les médias après la déclaration de la règle de feuille de style @media css
Exemple de code :
<style type="text/css">
div {font-size;12px;}
@media screen, print{
  div { color:red;}
}
</style>

Pour en savoir plus sur les valeurs des média, voir les cour de css (Les médias).

Exemple de code media

Application des media

La règle de feuille de style css @media permet de cacher de certaines propriétés css qui ne seraient pas compatibles avec les vieux navigateurs.
La règle de feuille de style css @media n'a pas d'équivalence en HTML ou XHTML.

Problèmes des media

La propriété de feuille de style css @media pose des problèmes car elle n'est interprétée par les vieux navigateurs, Netscape 4 par exemple. Netscape, FireFox ne prend pas en compte la règle si le média n'est pas spécifié.

BUG INTERNAUTE

Explication

Vous trouverez ci-dessous divers bugs d'interprétation de la css media.
Ces bugs ont été transmis par les internautes du site.

J'ai vérifié certains bugs mais pour la plupart, ils sont soit sur MAC soit sur un navigateur que je ne possède pas.
Ceux que j'ai pu visualiser sont notés
Bug vérifié : oui.

Reporter un bug

Voir les Bugs[0]


Reporter un bug ou problème d'interprétationavec la propriété media