Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Titre du document</title> <style> body { background-color: #1c87c9; } @media screen and (max-width: 411px) { body { background-color: #cce5ff; } } @media screen and (min-width: 768px) { body { background-color: #eee; } } @media screen and (max-width: 962px) and (min-width: 450px), (min-width: 1366px) { background-color: #333; } </style> </head> <body> <h2>Exemple de la règle @media</h2> <p>Redimensionnez le navigateur pour voir l'effet.</p> <p>Les requêtes média définissent la couleur d'arrière-plan sur gris si la fenêtre d'affichage a une largeur de 600 pixels ou plus, sur vert si la fenêtre d'affichage a une largeur comprise entre 200 et 599 pixels. Si la fenêtre est inférieure à 200 pixels, la couleur d'arrière-plan est bleue.</p> </body> </html>