IT-Kurs HTML-Grundlagen 010_Elemente, Attribute

Elemente

Start-Tag	Elementinhalt	End-Tag
`<h1>`	Dies ist eine Überschrift	`</h1>`
`<p>`	Dies ist ein Absatz	`</p>`
`<a href="https://www.zhaojian.net/" title="Link">`	Dies ist ein Link	`</a>`
`<img src="/images/logo.png" alt="Dies ist ein Bild">`	Dies ist ein Bild
`<br>`	Zeilenumbruch

1
<!DOCTYPE html>
2
<html lang="en">
3

4
    <head>
5
        <meta charset="UTF-8" />
6
        <title>hello HTML</title>
7
    </head>
8

9
    <body>
10
        <h1>Dies ist eine Überschrift</h1>
11
        <p>
12
            Dies ist ein Absatz<br>
13
            <a href="https://www.zhaojian.net/" title="Link">Dies ist ein Link</a>
14
        </p>
15
        <img src="/images/logo.png" alt="Dies ist ein Bild" />
16
        <br />
17
    </body>
18

19
</html>

[!Zusammenfassung]

HTML-Elemente beginnen mit einem Start-Tag (Anfang) und enden mit einem End-Tag (Abschluss)

Der Inhalt eines HTML-Elements ist der Inhalt zwischen Start-Tag und End-Tag

Einige HTML-Elemente haben leeren Inhalt (empty content). Diese Elemente ohne Inhalt und ohne schließendes Tag werden als leere Tags oder leere Elemente bezeichnet, um spezifische Funktionen bei Wahrung von Einfachheit und Flexibilität zu implementieren, wie z.B.: <br>, <hr>, <img>, <meta>, <input> usw.

Die meisten HTML-Elemente können Attribute haben

HTML-Elemente werden üblicherweise als HTML-Tags (HTML tag) bezeichnet

HTML-Elemente treten normalerweise paarweise auf, zum Beispiel <p> und </p>

HTML-Elemente können andere HTML-Tags verschachteln

HTML-Elemente sind nicht groß-/kleinschreibungsempfindlich, Kleinschreibung wird empfohlen

Attribute

HTML-Elemente können Attribute (Attribute) haben, die weitere Informationen über das Element liefern oder bestimmte Verhaltensweisen des Elements definieren. Attribute werden immer im Start-Tag definiert und erscheinen üblicherweise in der Form “Attributname=Attributwert”. Beispielsweise kann das Link-Element (a) das href-Attribut verwenden, um die Zieladresse des Links anzugeben:

Beispiel:

1
<a href="https://www.zhaojian.net">zhaoJian.Net</a>

Ergebnis:

Beispieleffekt

Im obigen Code hat das href-Attribut des a-Elements den Wert "https://www.zhaojian.net", was bedeutet, dass der Browser beim Klicken auf diesen Link zu dieser URL springt.

Häufig verwendete Attribute:

id: Stellt einen eindeutigen Identifikator für das Element bereit.
class: Stellt einen oder mehrere Klassennamen für das Element bereit. Verschiedene Elemente können denselben Klassennamen erhalten.
style: Stellt Inline-Stile für das Element bereit.
title: Fügt Titelinhalt zum Link-Element hinzu.
alt: Fügt Beschreibungsinhalt zum Bild-Element hinzu.

[!Zusammenfassung]

Attribute erscheinen immer in Form von Name-Wert-Paaren, zum Beispiel: name="value".

Zwischen dem Attribut und dem Elementnamen (oder dem vorherigen Attribut, falls mehr als ein Attribut vorhanden ist) sollte ein Leerzeichen eingefügt werden.

Attributwerte sollten immer in Anführungszeichen gesetzt werden. Doppelte Anführungszeichen sind am gebräuchlichsten, aber einfache Anführungszeichen sind auch in Ordnung.

Attribute und Attributwerte sind nicht groß-/kleinschreibungsempfindlich, Kleinschreibung wird empfohlen.

Elemente

Attribute

Kommentare