Exécuter
❯
Exécuter le code
Ctrl+Alt+R
Enregistrer le code
Ctrl+Alt+A
Changer d'orientation
Ctrl+Alt+O
Changer de thème
Ctrl+Alt+D
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> @media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: aucun !important; } } div { largeur: 100px; hauteur: 100px; couleur-de-fond: rouge; position: relative; animation-name: exemple; animation-duration: 4s; } @keyframes example { 0% {background-color:red; left:0px; top:0px;} 25% {background-color:jaune; left:200px; top:0px;} 50% {background-color:blue; left:200px; top:200px;} 75% {background-color:green; left:0px; top:200px;} 100% {background-color:rouge; left:0px; top:0px;} } </style> </head> <body> <h1>Respecter les préférences de l'utilisateur</h1> <p>The prefers-reduced-motion media feature checks if a user has asked to reduce motion, such as animations or transitions. Use this feature to turn off animations and transitions for the users who has activated this setting on their computer.</p> <div></div> </body> </html>