HTML -Stile
Das HTML style
-Attribut wird verwendet, um einem Element Stile hinzuzufügen, z. B. Farbe, Schriftart, Größe und mehr.
Beispiel
Ich bin Rot
Ich bin blau
Ich bin groß
Das HTML-Stilattribut
Das Festlegen des Stils eines HTML-Elements kann mit dem style
Attribut erfolgen.
Das HTML- style
Attribut hat die folgende Syntax:
<tagname
style="property:value;">
Die Eigenschaft ist eine CSS-Eigenschaft. Der Wert ist ein CSS-Wert.
Später in diesem Tutorial erfahren Sie mehr über CSS.
Hintergrundfarbe
Die CSS background-color
-Eigenschaft definiert die Hintergrundfarbe für ein HTML-Element.
Beispiel
Stellen Sie die Hintergrundfarbe für eine Seite auf Puderblau ein:
<body style="background-color:powderblue;">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
Beispiel
Legen Sie die Hintergrundfarbe für zwei verschiedene Elemente fest:
<body>
<h1 style="background-color:powderblue;">This is a heading</h1>
<p
style="background-color:tomato;">This is a paragraph.</p>
</body>
Textfarbe
Die CSS color
-Eigenschaft definiert die Textfarbe für ein HTML-Element:
Beispiel
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
Schriftarten
Die CSS font-family
-Eigenschaft definiert die Schriftart, die für ein HTML-Element verwendet werden soll:
Beispiel
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
Textgröße
Die CSS font-size
-Eigenschaft definiert die Textgröße für ein HTML-Element:
Beispiel
<h1 style="font-size:300%;">This is a heading</h1>
<p
style="font-size:160%;">This is a paragraph.</p>
Textausrichtung
Die CSS text-align
-Eigenschaft definiert die horizontale Textausrichtung für ein HTML-Element:
Beispiel
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>
Kapitelzusammenfassung
- Verwenden Sie das
style
Attribut zum Gestalten von HTML-Elementen - Verwenden Sie
background-color
für die Hintergrundfarbe - Verwenden Sie
color
für Textfarben font-family
Für Textschriften verwenden- Verwenden Sie
font-size
für Textgrößen text-align
Zur Textausrichtung verwenden