Une horloge numérique réalisée uniquement en CSS
(quaxio.com)-
Une horloge numérique réalisée uniquement en CSS, sans JavaScript ni HTML
-
Les explications se trouvent dans les commentaires du code source CSS
→ Commence à 12:00:00
→ Représentation d’un afficheur 7 segments (LCD) avec une animation CSS basée sur les keyframes
- On peut y voir divers ajustements entre navigateurs pour obtenir un code minimal
→ Même en ajoutant seulement la balise <link>, le navigateur génère implicitement <html>, <head> et <body>
→ Sans content: "", ::before et ::after ne s’affichent pas
→ Sans display: block, html, head et link ne sont pas visibles
→ Sans définir une bordure invisible comme border: 1px solid #fff, Safari n’exécute pas l’animation
1 commentaires
On dirait que c’est du Swiss made, mais l’affichage des minutes n’est pas très net :)