Hier wird der Inhalt im Ich möchte sowohl :before Pseudo-Element in Rot angezeigt, aber ich möchte auch das Zeichen "F" von " F erstes Zeichen dieses Absatzes" in Blau formatieren. Stattdessen sehe ich das "F" von " F :before als auch den ersten Buchstaben von .normal nach dem :before Inhalt auf den gleichen Absatz anwenden. Ist das möglich? Wenn ja, wie?
Normalerweise würden Sie dies mit dem :first-letter Pseudo-Element tun, aber da Sie :before content haben, was Fügt Text vor den eigentlichen Inhalt Ihres Absatzes ein, dann entspricht :first-letter nicht dem ersten Buchstaben des eigentlichen Inhalts, sondern dem ersten Buchstaben des :before content stattdessen.
Das bedeutet, dass statt dessen:
%Vor%Sie bekommen das tatsächlich:
%Vor%Aufgrund der Funktionsweise von CSS-generierten Inhalten glaube ich nicht, dass es in reinem CSS eine Lösung gibt, den ersten Buchstaben des eigentlichen Inhalts zu erreichen, nachdem Sie zuvor Inhalte eingefügt haben.
Alternativ können Sie auch ein span anstelle des :first-letter Pseudo-Elements verwenden, auf das Sie dann die blaue Farbe anwenden können, aber das bedeutet, dass Sie zusätzliche Elemente einfügen müssen:
Tags und Links css pseudo-element