Media queries

Media queries est un module CSS3 permettant d'adapter le contenu d'une page web aux caractéristiques de l'appareil de l'utilisateur (par exemple, écran de téléphone intelligent versus écran d'ordinateur). De telles adaptations sont devenues une norme W3C recommandée en juin 2012. Il s'agit de la pierre angulaire des sites web adaptatifs.

Exemples

@media screen and (display-mode: fullscreen) {
  /* S'applique seulement au plein écran */
}

@media all and (orientation: landscape) {
  /* S'applique seulement à l'orientation paysage */
}

@media screen and (min-device-width: 500px) {
  /* S'applique seulement aux écrans de largeur supérieure ou égale à 500 pixels */
}