Ich habe:
%Vor% und ich versuche, h
, m
und s
kleiner als den Rest des Textes zu machen. Ich habe von dem Pseudo-Element nth-letter
in CSS gehört, aber es scheint nicht zu funktionieren:
Ich weiß, dass ich JavaScript verwenden könnte, um die Zeichenfolge zu analysieren und den Buchstaben durch die umgebenden span
-Tags zu ersetzen und die Tags zu formatieren. Die Zeichenfolge wird jedoch jede Sekunde aktualisiert, und es scheint, dass das Parsen oft ressourcenintensiv ist.
Im Hinblick auf die Leistung würde ich eine span
Hölle empfehlen.
Eine Spanne für jedes h
, m
und s
Zeichen, damit Sie sie richtig formatieren können (kann für jedes das gleiche oder ein anderes Styling anwenden).
Und ein weiterer Bereich für jede Nummer, damit Sie die Referenzen zwischenspeichern können. Zusammengefasst, hier ist ein JS für eine sehr simple lokale Zeituhr:
%Vor%Dies veranschaulicht die Grundidee von Cache-Selektoren. Indem Sie die Elemente nicht neu erstellen, haben Sie auch einen guten Leistungsschub.
Obwohl eine Sekunde nicht sehr schwer ist, arbeiten Sie für etwas so Einfaches (außer Sie haben Hunderte von Uhren auf Ihrer Seite).
Dies könnte eine langatmige Art sein, dies mit Javascript und jQuery zu tun, aber hier ist eine mögliche Lösung.
Trennen Sie die h
, m
& amp; s
aus der ursprünglichen Zeichenfolge.
Dann können Sie die Spannen innerhalb von #string
mit CSS gestalten.
Hier ist eine Demo-Geige, die das obige zeigt .
Tags und Links javascript css pseudo-class styling