Informatik :: CSS :: Textgestaltung
Das Attribut text-decoration hat seinen Namen wirklich nich zu Unrecht erhalten. Mit seiner Hilfe können Sie Text in unterschiedlichster Art und Weise dekorieren - nein, nicht mit Girlanden, sondern mit Linien. Und das wäre unterstrichen (underline) und durchgestrichen (line-through).
Das Attribut text-decoration bezieht sich in seiner Wirkung leider auch nicht nur auf die Dekoration einer Seite , sondern wirkt nur auf den entsprechenden Text. Folglich ist es hier nicht möglich , lediglich eine farbige Linie einzufügen, denn das zusätzliche Attribut color färbt Text und Dekoration gleichermaßen ein.
Beispiel:
<p style="text-decoration:underline;font-size:180%"> Beispiel 1</p> <p style="text-decoration:line-through;font-size:50px"> Beispiel 2</p>
Das Beispiel hätte folgendes Aussehen.
Eines der großen Probleme in HTML besteht im Einrücken von Text.
Sicher, es gibt einige Tricks, mit denen es auch dafür eine Lösung
gibt, aber CSS kann das einfach besser.
Das erforderliche Attribut heißt text-ident und erwartet
einen numerischen Wert mit einer Maßeinheit, der die Tiefe
der Einrückung der ersten Zeile eines Absatzes (Erstzeileneinzug)
angibt.
Beispiel:
<p style="text-ident:20px"> Text ... </p>
Mit dem Attribut background-color erstellen Sie eine beliebige Hintergrundfarbe für einen Textabschnitt. Alternativ können Sie auch eine Grafik
mit einem farbigen Hintergrund versehen.
Während bei Netscape nur der entsprechende Text- oder Grafikbereich
eine Hintergrundfarbe erhält, zieht sich mittels Internet Explorer
die Hintergrundfarbe über die gesamte Bildschirmbreite. Mit diesem
Trick erhalten Sie einen interessanten Effekt, mit dem sich Seiten gut
in einzelne Abschnitte gliedern lassen.
Beispiel:
<h1 style="background-color:#c0c0c0;color:#ffffff">Hintergrundfarben für Text</h1> <p style="background-color:#c0c0c0"><img src="btlampe.gif"> Informationen</p>
Das Beispiel hat folgendes Aussehen.
Die Verwendung eines Hintergrundbildes bietet in HTML wenig Möglichkeiten.
Mit CSS können Sie endlich verschiedene Varianten zum Gestalten der
Seite verwenden. Sie können z.B. ein Hintergrundbild für eine
Zeile oder einen ganzen Abschnitt definieren. Dann wird der entsprechende
Text mit dem Bild hinterlegt, was eine interessante Gestaltungsmöglichkeit
darstellt.
Zum Einbinden eines Hintergrundbildes verwenden Sie das Attribut background-image und übergeben ihm den Namen bzw. die Adresse des Bildes.
Beispiel:
<h1 style="background-image:url(bgziegel.gif)" align=center><br>Angebot<br>für Häuslebauer</h1>
Das Beispiel hat folgendes Aussehen.
Aufgabe: