4 Punkte von xguru 2021-01-02 | 1 Kommentare | Auf WhatsApp teilen
  • Eine digitale Uhr, die ausschließlich mit CSS erstellt wurde, ganz ohne JavaScript oder HTML

  • Die Erklärung steht in den Kommentaren des CSS-Quellcodes

→ Startet bei 12:00:00

→ Stellt mithilfe von CSS-Animationen mit Keyframes eine 7-Segment-Anzeige (LCD) dar

  • Man kann verschiedene Browser-Tweaks für möglichst minimalen Code sehen

→ Schon das Einfügen des <link>-Tags veranlasst den Browser dazu, <html>, <head> und <body> implizit zu erzeugen

→ Ohne content: "" sind ::before und ::after nicht sichtbar

→ Ohne display: block sind html, head und link nicht sichtbar

→ Wenn kein unsichtbarer Rahmen wie border: 1px solid #fff gesetzt wird, führt Safari die Animation nicht aus

1 Kommentare

 
kbumsik 2021-01-02

Soll aus der Schweiz stammen, aber die Minutenanzeige ist nicht gerade sauber :)