HTML-Styles

Das style-Attribut wird verwendet, um die Stile von HTML-Elementen zu ändern.

Dieser Text ist in Verdana und rot
Dieser Text ist in Times und blau
Dieser Text ist 30 Pixel hoch

Versuchen Sie es selbst

HTML style-Attribut

Die Funktion des style-Attributs:

Bietet eine allgemeine Methode, um die Stile aller HTML-Elemente zu ändern.

Stile wurden mit HTML 4 eingeführt und stellen eine neue bevorzugte Methode zur Änderung der Stile von HTML-Elementen dar. Durch HTML-Stile können Sie direkt über das style-Attribut Stile zu HTML-Elementen hinzufügen oder indirekt in separaten Stilblättern (CSS-Dateien) definieren.

Sie finden alle Informationen zu Stilen und CSS in unseren CSS-TutorialLernen Sie hier alles über Stile und CSS.

In unserem HTML-Tutorial werden wir den style-Attribute verwenden, um Ihnen HTML-Styles zu erläutern.

Nicht empfohlene Tags und Eigenschaften

In HTML 4 sind mehrere Tags und Eigenschaften veraltet.

Die übermittelte Information ist klar: Vermeiden Sie diese veralteten Tags und Eigenschaften!

Vermeiden Sie die folgenden Tags und Eigenschaften:

Tag Beschreibung
<center> Definieren Sie zentrierte Inhalte.
<font> und <basefont> Definieren Sie die HTML-Schriftart.
<s> und <strike> Definieren Sie durchgestrichenen Text
<u> Definieren Sie unterstrichenen Text
Eigenschaft Beschreibung
align Definieren Sie die Ausrichtung des Textes
bgcolor Definieren Sie die Hintergrundfarbe
color Definieren Sie die Textfarbe

Für die folgenden Tags und Eigenschaften: Verwenden Sie Stile anstelle davon!

HTML-Stylesbeispiel - Hintergrundfarbe

Die Eigenschaft background-color definiert die Hintergrundfarbe des Elements:

<html>
<body style="background-color:yellow">
<h2 style="background-color:red">Dies ist ein Titel</h2>
<p style="background-color:green">Dies ist ein Absatz.</p>
</body>
</html>

Versuchen Sie es selbst

Die style-Eigenschaft hat die "alten" bgcolor-Eigenschaft abgelöst.

Versuchen Sie es selbst: Alte Methode zur Einrichtung von Hintergrundfarben

HTML Style-Beispiel - Schriftarten, Farben und Größen

Die Eigenschaften font-family, color und font-size definieren die Zeichensatzreihe, Farbe und Schriftgröße des Texts eines Elements:

<html>
<body>
<h1 style="font-family:verdana">Ein Titel</h1>
<p style="font-family:arial;color:red;font-size:20px;">Ein Absatz.</p>
</body>
</html>

Versuchen Sie es selbst

Die style-Eigenschaft hat das alte <font>-Tag abgelöst.

Versuchen Sie es selbst: Alte Methode zur Einrichtung von Schriftarten

HTML Style-Beispiel - Textausrichtung

Die text-align-Eigenschaft legt die horizontale Ausrichtung des Texts eines Elements fest:

<html>
<body>
<h1 style="text-align:center">Dies ist ein Titel</h1>
<p>Der obige Titel ist in die Mitte dieser Seite ausgerichtet.</p>
</body>
</html>

Versuchen Sie es selbst

Die style-Eigenschaft hat die alte "align"-Eigenschaft abgelöst.

Versuchen Sie es selbst: Alte Methode zur Einrichtung von Zentrierung