GENERAL TRACK

Deine erste Webseite

Erstelle eine persönliche Profilseite mit von KI generiertem HTML und CSS.

1HTML-Grundlagen: Was sind Tags?

Bevor wir unsere Seite bauen, verstehen wir ein Schlüsselkonzept: HTML-Tags. Stell dir Tags wie Etiketten auf Behältern vor. Jedes Tag sagt dem Browser, welche Art von Inhalt sich darin befindet.

Tags sind wie beschriftete Kisten

<h1>

Große Überschrift (wie ein Kapiteltitel)

<p>

Textabsatz

<ul> + <li>

Aufzählungsliste mit Elementen

Jedes Tag öffnet und schließt sich: <h1>content</h1>. Der Browser liest diese Tags und zeigt den Inhalt entsprechend an. Klicke auf Code ausführen, um es zu sehen:

HTML

<!DOCTYPE html>
<html>
<head>
  <title>Understanding Tags</title>
</head>
<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph of text.</p>
  <ul>
    <li>This is a list item</li>
    <li>This is another item</li>
  </ul>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
  <title>Understanding Tags</title>
</head>
<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph of text.</p>
  <ul>
    <li>This is a list item</li>
    <li>This is another item</li>
  </ul>
</body>
</html>

Output

Your guide

2Eine Profilseite mit KI erstellen

3Mach sie zu deiner eigenen

4Level up: Modernes Styling mit CSS

5Herausforderung: Baue deine eigene Profilseite

Was ist Vibe Coding?

ALL TUTORIALS

Dinge interaktiv machen