HTML - Tags <h1> bis <h6>


Beispiel

Die sechs verschiedenen HTML-Überschriften:

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

Weitere „Probieren Sie es selbst“-Beispiele weiter unten.


Definition und Verwendung

Die <h1>to <h6>-Tags werden verwendet, um HTML-Überschriften zu definieren.

<h1>definiert die wichtigste Überschrift. <h6>definiert die am wenigsten wichtige Überschrift.

Hinweis: Verwenden Sie nur eine <h1> pro Seite – dies sollte die Hauptüberschrift/das Hauptthema für die gesamte Seite darstellen. Überspringen Sie auch keine Überschriftenebenen – beginnen Sie mit <h1>, verwenden Sie dann <h2>und so weiter.


Browser-Unterstützung

Element
<h1> - <h6> Yes Yes Yes Yes Yes

Globale Attribute

Die <h1>to <h6>-Tags unterstützen auch die globalen Attribute in HTML .


Ereignisattribute

Die <h1>to <h6>-Tags unterstützen auch die Event-Attribute in HTML .



Mehr Beispiele

Beispiel

Legen Sie die Hintergrundfarbe und die Textfarbe von Überschriften fest (mit CSS):

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<h2 style="color:Tomato;">Hello World</h2>

Beispiel

Legen Sie die Ausrichtung von Überschriften fest (mit CSS):

<h1 style="text-align:center">This is heading 1</h1>
<h2 style="text-align:left">This is heading 2</h2>
<h3 style="text-align:right">This is heading 3</h3>
<h4 style="text-align:justify">This is heading 4</h4>

Verwandte Seiten

HTML-Tutorial: HTML-Überschriften

HTML-DOM-Referenz: Heading-Objekt


Standard-CSS-Einstellungen

Die meisten Browser zeigen das <h1>Element mit den folgenden Standardwerten an:

Beispiel

h1 {
  display: block;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Die meisten Browser zeigen das <h2>Element mit den folgenden Standardwerten an:

Beispiel

h2 {
  display: block;
  font-size: 1.5em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Die meisten Browser zeigen das <h3>Element mit den folgenden Standardwerten an:

Beispiel

h3 {
  display: block;
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Die meisten Browser zeigen das <h4>Element mit den folgenden Standardwerten an:

Beispiel

h4 {
  display: block;
  font-size: 1em;
  margin-top: 1.33em;
  margin-bottom: 1.33em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Die meisten Browser zeigen das <h5>Element mit den folgenden Standardwerten an:

Beispiel

h5 {
  display: block;
  font-size: .83em;
  margin-top: 1.67em;
  margin-bottom: 1.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

Die meisten Browser zeigen das <h6>Element mit den folgenden Standardwerten an:

Beispiel

h6 {
  display: block;
  font-size: .67em;
  margin-top: 2.33em;
  margin-bottom: 2.33em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}