Einzelne Buchstaben über CSS färben, wie?

Ich möchte über CSS in einem HTML Dokument einzelne Buchstaben eines Wortes färben. Z.B. Hallo (H in Grün, a in blau, l in lila, usw.)

Kann mir jemand sagen wie genau das funktioniert?

Am besten gleich die Syntax.

Answer 1

[Minilexikon]

Vielleicht hilft dir jQuery dabei, es etwas dynamischer zu gestalten. Ich habe mal PeterKremsners und Bananenbrot24s Lösungswege ein bisschen weiterentwickelt: http://codepen.io/Minilexikon/pen/YqVKBL

Du kannst in dem Array charcolors einfach die Farben für die Buchstaben (eigentlich die Klassennamen) festlegen und das Array beliebig erweitern; den Rest macht jQuery ;)

Kleine Warnung: Das geht nur bei Divs oder p-Tags, die nur Text enthalten.

Woher ich das weiß: Berufserfahrung – Seit 2014

Answer 2

[Bananenbrot24]

Über Spans, denke ich. Geht bestimmt noch irgendwie einfacher, aber im Prinzip machst du ein paar Klassen und verwendest diese in spans.

.font-red { color: #hexcode-für-rot;}
.font-blue { color: #selbes-spiel-hier;}
[...]

<span class="font-red">H</span><span class="font-blue">A</span>[...]

Answer 3

[PeterKremsner]

Kannst du mit htmltags leichter machen:

<span style="color: green;">H</span>

<span style="color: blue;">a</span> usw.

Siehe hier:

https://jsfiddle.net/n80gxht0/