HTML (HyperText Markup Language) bietet sechs spezielle Tags zum Anzeigen von Überschriften unterschiedlicher Ebenen. Alle haben Standardparameter (Größe und Stil der Schriftart, Anzahl der Einrückungen vom vorherigen und nächsten Element usw.). Diese Optionen können mit CSS-Anweisungen (Cascading Style Sheets) überschrieben werden und so das Aussehen von Überschriften im Text einer Webseite verändern.
Anleitung
Schritt 1
Platzieren Sie Überschriften unterschiedlicher Ebenen zwischen den entsprechenden öffnenden und schließenden Tags, falls dies noch nicht im Quellcode der Webseite geschehen ist. Zum Beispiel sollte die wichtigste Überschrift (erste Ebene) zwischen den Tags stehen
und
:
Überschrift der ersten Ebene
Die Zwischenüberschrift der nächstwichtigsten Ebene sollte zwischen den Tags platziert werden
und
usw. Die letzte der vorgesehenen Stufen ist die sechste -
und
Schritt 2
Fügen Sie im Header-Teil des Quellcodes (zwischen den und -Tags) eine Anweisung ein, die dem Browser des Besuchers mitteilt, dass an dieser Stelle eine Beschreibung der Stile in CSS vorhanden ist:
/ * CSS-Anweisungen werden hier sein * /
Schritt 3
Fügen Sie zwischen den öffnenden und schließenden Stil-Tags Stilbeschreibungen für die Überschriften jeder Ebene hinzu, deren Aussehen Sie ändern möchten. Wenn Sie beispielsweise nur das Aussehen der Überschriften der ersten Ebene ändern müssen, könnte dieser Code wie folgt aussehen:
h1 {
Farbe Rot;
Schriftgröße: 20px;
Schriftstil: kursiv;
Schriftdicke: fett;
Rand oben: 30px;
Rand-unten: 20px;
}
Hier zeigt h1 an, dass sich die Beschreibung in geschweiften Klammern auf das h1-Tag bezieht und als "Selektor" bezeichnet wird. Der Parameter color legt die Farbe des Textes fest, der Parameter font-size ist die Schriftgröße, der font-style mit dem kursiven Wert ist die kursive Schrift, der font-weight mit dem fetten Wert ist fett, margin-top ist der obere margin, und margin-bottom ist der untere Rand. Fügen Sie für Überschriften der zweiten Ebene einen ähnlichen Block mit einem h2-Selektor usw. hinzu.
Schritt 4
Verwenden Sie die Abkürzungssyntax, wenn viele Ebenen beschrieben werden müssen. Zum Beispiel können Schriftartbeschreibungen in einem Parameter platziert werden, ebenso wie Beschreibungen von Einzugsgrößen. Stichprobe:
h1 {
Farbe Rot;
Schriftart: fett 20px arial;
Rand: 30px 0 20px 0;
}
h2 {
Farbe orange;
Schriftart: fettes 18px-Arial;
Rand: 25px 0 15px 0;
}
Im Parameter margin müssen die Ränder im Uhrzeigersinn beginnend vom oberen Rand durch ein Leerzeichen (oben rechts unten links) angegeben werden.
