CSS Tutorial und HTML Beispiele

CSS (Cascading Style Sheets) Basics Tutorial. Dazu Beispiele mit HTML in Verbindung mit CSS.

CSS text-shadow

Neuen Eigenschaften zur Textformatierung bietet CSS 3. Unter anderem gibt es dort nun die Möglichkeit einfachen Text mit einem Schatten zu versehen.

Das Ergebnis als Beispiel eine h3 Überschrift sieht so aus:

Text mit Schatten-Effekt

h4 {
    text-shadow: 1px 1px 0px #000;
}

Andere weiter Variante könnte so aussehen:

Text mit Schatten-Effekt oben und unten

h4 {
    text-shadow: -1px -1px 0px #000, 1px 1px 0px #888888;
}

Noch ein Möglichkeit:

Text mit Schatten-Effekt glühende Ränder

h4 {
    text-shadow: 0px 0px 10px #000;
}

Kleiner Wehrmutstropfen ist hierbei wieder einmal die Kompatibilität zu den verschiedenen Browsern. Bei aktuellen Internet Explorer gibt es Probleme bei der Darstellung.

Aber Firefox kann (natürlich wieder einmal) die neuen CSS 3 Formatierungen ohne Probleme darstellen. Darum bitte hier den aktuellen Firefox besorgen.

Weitere Links zum Thema CSS 3.0 und den neuen Möglichkeiten die geboten werden gibts auf den folgenden Seiten: