Der Schlüssel zum Erfolg ist die CSS-Eigenschaft text-shadow. Sie bietet die Möglichkeit, einem einfachen html-Text mittels CSS-Code einen Schatten zu geben.
text-shadow: 0 0 1px #000000;
Der Aufbau der Eigenschaft ist einfach: Der erste Wert gibt die horizontale Position und der Zweite die vertikale Position des Schattens an. Der dritte Wert steht für den Grad der Unschärfe und der Vierte für die Farbe. Man kann dem Text auch mehrere Schatten zuweisen. So ist der Leuchteffekt möglich.
Beispiel:
CSS-Code:
background: #000000;
color: #DAF8E4;
text-shadow: 0 0 3px #DAF8E4, 0 0 5px #DAF8E4, 0 0 10px #DAF8E4, 0 0 20px #DAF8E4, 0 0 30px #1bb426, 0 0 40px #1bb426, 0 0 70px #1bb426, 0 0 80px #1bb426, 0 0 90px #1bb426;
Ich habe mit dieser Methode verschiedene Dinge ausprobiert, hier findest du einige der Resultate inklusive CSS-Code. Die Schriften leuchten auf, wenn man sie mit dem Mauszeiger berührt.