If you're seeing this message, it means we're having trouble loading external resources on our website.

Wenn du hinter einem Webfilter bist, stelle sicher, dass die Domänen *. kastatic.org und *. kasandbox.org nicht blockiert sind.

Hauptinhalt

Lerneinheit: Einführung in HTML/CSS: Webseiten erstellen

Einführung in HTML

Erfahre, was HTML ist und wie man eine Webseite aus Markup-Text und Bildern macht.
Lerne
Herzlich Willkommen im Web!
(Öffnet ein modal)
HTML-Grundlagen
(Öffnet ein modal)
Tipp: HTML-Tags
(Öffnet ein modal)
Challenge: Schreibe ein Gedicht
(Öffnet ein modal)
HTML: Text hervorheben
(Öffnet ein modal)
Challenge: Du kannst Text-Tags lernen
(Öffnet ein modal)
HTML: Listen
(Öffnet ein modal)
Challenge: Deine Lernliste
(Öffnet ein modal)
HTML: Bilder
(Öffnet ein modal)
Challenge: Eine traumhafte Reise
(Öffnet ein modal)

Einführung in CSS

Erfahre, wie man einfache CSS Regeln verfasst, wobei man Elemente, Klassen oder IDs anspricht, um die Farben deiner Seite zu ändern.
Lerne
CSS-Grundlagen
(Öffnet ein modal)
Tipp: Nach Tag-Namen selektieren
(Öffnet ein modal)
Challenge: Das farbenfrohe Viech
(Öffnet ein modal)
Challenge: Die Jahreszeiten- IDs
(Öffnet ein modal)
Challenge: Äpfel- und Bananenklassen
(Öffnet ein modal)
Übe
Quiz: Einfache CSS-Selektoren
4 Aufgaben

Weitere HTML-Tags

Lerne, wie man Links, Tabellen und Kommentare erstellt.
Lerne
Challenge: Lieblingslinks
(Öffnet ein modal)
Challenge: Spring dahin!
(Öffnet ein modal)
Challenge: Abendessen
(Öffnet ein modal)

CSS Text-Eigenschaften

Lerne, wie du deinen Text, mit Font Familien, Größe, Abstand und Ausrichtung gestaltest.
Lerne
Challenge: Coole Schriftfamilien
(Öffnet ein modal)
Challenge: Riesengroße Schriftgrößen
(Öffnet ein modal)
Challenge: Berühmte Font-Formate
(Öffnet ein modal)
Übe
Quiz: Texteigenschaften
5 Aufgaben

Web-Entwicklungstools

Lerne, wie du andere Editoren zum Entwickeln deiner Webseiten benutzt und wie du die Browser-Entwicklertools zum Debuggen deiner Webseiten einsetzt.
Lerne
Die Browser-Entwicklertools benutzen
(Öffnet ein modal)
Webseiten außerhalb der Khan Academy entwickeln
(Öffnet ein modal)

CSS-Layout

Lerne, wie du die HTML-Elemente span und div und CSS-Eigenschaften wie position und float einsetzt, um das Layout deiner Webseite anzupassen.
Lerne
Challenge: Die Gruppierer
(Öffnet ein modal)
Der übervolle Ozean
(Öffnet ein modal)
Challenge: Das Boxer-Modell
(Öffnet ein modal)
Challenge: Die Position des Planeten
(Öffnet ein modal)
Challenge: Schwimmende Wolken
(Öffnet ein modal)
Plane deine Webseite
(Öffnet ein modal)
Übe
Quiz: CSS-Layout
5 Aufgaben

Weitere CSS-Selektoren

Lerne komplexe Selektoren mit mehreren Klassen, Element mit Klassen, untergeordnete Selektoren, gruppierte Selektoren und dynamische Pseudoklassen.
Lerne
Challenge: Eine klasse Galerie
(Öffnet ein modal)
Challenge: Elementklassen
(Öffnet ein modal)
Challenge: Nachfahren von Khan
(Öffnet ein modal)
Challenge: Gruppierte Tiere
(Öffnet ein modal)
Übe
Quiz: CSS-Spezifität
3 Aufgaben

Lerne mehr

Was kannst du tun, um mehr HTML und CSS zu lernen?
Lerne
Webpage Design
(Öffnet ein modal)
Was du als Nächstes lernen kannst
(Öffnet ein modal)
Übe
Quiz: Validiere dieses HTML
3 Aufgaben

Über diese Lektion

Lerne, wie du mit HTML und CSS Webseiten erstellen kannst. HTML ist die Markup Language, mit der du den Inhalt, die Überschriften, Listen, Tabellen, usw auf deiner Seite beschreibst. CSS ist die Stylesheet Language, um die Seite zu gestalten und Farbe, Schriftart, Layout und vieles mehr zu definieren.