SELFHTML/Quickbar  CSS Style-Sheets  Style-Sheets definieren


Schnellformatierung im Text

Diese Seite ist ein Dokument mit Informationstext

 Einzelne HTML-Tags formatieren
 Bereiche mit <span> formatieren

 

CSS1.0MS IE3.0Netscape 4.0 Einzelne HTML-Tags formatieren

Beispiel Anzeigebeispiel: So sieht's aus

Sie können einzelne HTML-Tags innerhalb des HTML-Dateikörpers mit Hilfe von Style-Sheet-Angaben formatieren. Die Formatierungsangaben gelten dann genau für den Geltungsbereich des betreffenden HTML-Tags. Das ist zum Beispiel für HTML-Tags zu  Absatztypen und Textgestaltung oder für solche zu  Tabellen sinnvoll.

Beispiel:

<html>
<head>
<title>Titel der Datei</title>
</head>
<body>
<div style="background-color:#FFFFE0">
<h1 style="color:red; font-size:36pt;">Überschrift 1. Ordnung</h1>
<p style="margin-left:1.5cm;">Ein Textabsatz</p>
</div>
</body>
</html>

Erläuterung:

Sie können Formatangaben für ein HTML-Tag bestimmen, indem Sie innerhalb des einleitenden HTML-Tags die Angabe style= und dahinter, in Anführungszeichen, die gewünschten Formatdefinitionen notieren. Innerhalb der Formatdefinitionen sind Style-Sheet-Angaben erlaubt. Jede Eigenschaftszuweisung besteht aus einem Namen, z.B. color und einem Wert, z.B. red, getrennt durch einen Doppelpunkt. Schließen Sie jede Formatdefinition jeweils durch einen Strichpunkt ab. Nur bei der letzten Formatdefinition vor der abschließenden geschweiften Klammer darf der Strichpunkt entfallen.

Wichtig: Zwar sind innerhalb einer Formatdefinition durchaus Leerzeichen erlaubt, aber der Netscape-Browser hat sich dabei als sehr empfindlich erwiesen - kurz gesagt, er ignoriert die Angaben. Obwohl es nicht so gut lesbar ist, ist es deshalb vorläufig auf jeden Fall besser, keine Leerzeichen innerhalb einer Formatdefinition zu verwenden.

Zu den einzelnen Formateigenschaften und ihren möglichen Werten siehe  Style-Sheet-Angaben.

Im obigen Beispiel werden die individuellen Formatangaben zunächst auf ein <div>-Tag angewendet, das verschiedene weitere Elemente enthält, nämlich eine Überschrift 1. Ordnung und einen gewöhnlichen Textabsatz. Auch diese Elemente werden im Beispiel mit Hilfe von Style-Sheet-Angaben individuell formatiert.

Beachten Sie:

Style-Sheet-Angaben für HTML-Tags wie <p> oder <li> werden nur interpretiert, wenn Sie ein einleitendes und ein abschließendes Tag notieren.

 

CSS1.0MS IE3.0Netscape 4.0 Bereiche mit <span> formatieren

Beispiel Anzeigebeispiel: So sieht's aus

Sie können Style-Sheet-Formatierungen an beliebigen Stellen innerhalb des normalen Textes definieren, ohne daß diese einem herkömmlichen HTML-Tag oder einer Unterklasse davon zugeordnet sind. Dafür steht ein neues HTML-Tag zur Verfügung, das sonst keine eigene Bedeutung hat und nur zum Definieren von Style-Sheet-Angaben dient. Dieses HTML-Tag eignet sich besonders dazu, um innerhalb des Geltungsbereichs anderer HTML-Tags einzelne Zeichen oder Wörter anders zu formatieren.

Beispiel:

<html>
<head>
<title>Titel der Datei</title>
</head>
<body>
<h1>&Uuml;berschrift 1. Ordnung mit <span style="color:blue;">blauem Text</span></h1>
<p>Normaler Textabsatz mit 
<span style="font-style:italic; color:red;">rotem kursiven Text</span></p>
</body>
</html>

Erläuterung:

Mit <span style=...> ... </span> können Sie Textabschnitte innerhalb anderer HTML-Tags nach Belieben formatieren (span = spannen). Hinter der Angabe style= notieren Sie die gewünschten Formateigenschaften. Die Angabe muß in Anführungszeichen stehen. Innerhalb der Formatdefinitionen sind Style-Sheet-Angaben erlaubt. Jede Eigenschaftszuweisung besteht aus einem Namen, z.B. font-style und einem Wert, z.B. italic, getrennt durch einen Doppelpunkt. Schließen Sie jede Formatdefinition jeweils durch einen Strichpunkt ab.

Zu den einzelnen Formateigenschaften und ihren möglichen Werten siehe  Style-Sheet-Angaben.

weiter: Maßeinheiten, Farbangaben, feste Angaben
zurück: Zentrale Formate definieren
 

SELFHTML/Quickbar  CSS Style-Sheets  Style-Sheets definieren

© 1998  Stefan Münz, muenz@csi.com

1