HTML und CSS sind die Grundbausteine jeder Website, die du... Mehr anzeigen
Informatik2,305 aufrufe·Aktualisiert May 27, 2026·2 SeitenHTML und CSS Grundlagen
S
Selin Ben@selinbenh_fde6c
1
of 2
HTML Grundlagen und Dokumentaufbau
Stell dir vor, du baust ein Haus - HTML ist wie das Gerüst, das alles zusammenhält. Mit der Hypertext Markup Language erstellst du die komplette Struktur deiner Website, während CSS (Cascade Style Sheet) später für das coole Design sorgt.
Jedes HTML-Dokument startet mit <!DOCTYPE html> - das sagt dem Browser "Hey, hier kommt eine HTML-Seite!". Das Wurzelelement <html> umschließt dann alles andere. Die Sprache gibst du mit lang="de" an.
Der Head-Bereich ist unsichtbar für Besucher, aber wichtig für Browser und Suchmaschinen. Hier steht der <title>, den du oben in der Browser-Registerkarte siehst. Im Body kommt dann der sichtbare Inhalt: Überschriften (<h1> bis <h6>), Textabschnitte (<p>) und Zeilenumbrüche (<br>).
Tipp: Denk an HTML wie an ein Buch - Head ist das Inhaltsverzeichnis, Body sind die Kapitel!
2
of 2
HTML-Elemente und Tabellen
Mit HTML-Elementen machst du deine Website lebendig! Bilder fügst du mit <img src=""> ein - das Bild muss im gleichen Ordner wie dein HTML-Dokument liegen. Der alt-Text ist super wichtig, falls das Bild mal nicht lädt.
Links erstellst du mit <a href=""> - damit verbindest du verschiedene Seiten miteinander. Für Listen hast du zwei Optionen: <ol> für nummerierte Listen (1, 2, 3...) und <ul> für einfache Aufzählungen mit Punkten.
Tabellen sind perfekt für strukturierte Daten. Das <table>-Element umschließt alles, <tr> erstellt Zeilen und <td> die einzelnen Zellen. Mit CSS kannst du dann Rahmen hinzufügen (border-style: solid) und Farben ändern (background-color, color).
Merke: Tabellen sind nicht für Layouts gedacht - nur für echte Daten wie Stundenplan oder Noten!
Wir dachten schon, du fragst nie...
Was ist der Knowunity KI-Begleiter?
Unser KI-Begleiter ist ein speziell für Schüler entwickeltes KI-Tool, das mehr als nur Antworten bietet. Basierend auf Millionen von Knowunity-Inhalten liefert er relevante Informationen, personalisierte Lernpläne, Quizze und Inhalte direkt im Chat und passt sich deinem individuellen Lernweg an.
Wo kann ich die Knowunity-App herunterladen?
Du kannst die App im Google Play Store und im Apple App Store herunterladen.
Ist Knowunity wirklich kostenlos?
Genau! Genieße kostenlosen Zugang zu Lerninhalten, vernetze dich mit anderen Schülern und hol dir sofortige Hilfe – alles direkt auf deinem Handy.
Ähnlicher Inhalt
Beliebtester Inhalt: HTML-Element
2Beliebtester Inhalt in Informatik
9Beliebtester Inhalt
9Findest du nicht, was du suchst? Entdecke andere Fächer.
Schüler lieben uns — und du auch.
4.6/5App Store
4.7/5Google Play
Die App ist sehr einfach zu bedienen und gut gestaltet. Ich habe bisher alles gefunden, wonach ich gesucht habe, und konnte viel aus den Präsentationen lernen! Ich werde die App definitiv für ein Schulprojekt nutzen! Und natürlich hilft sie auch sehr als Inspiration.
Stefan SiOS-Nutzer
Diese App ist wirklich super. Es gibt so viele Lernzettel und Hilfen [...]. Mein Problemfach ist zum Beispiel Französisch und die App hat so viele Möglichkeiten zur Hilfe. Dank dieser App habe ich mich in Französisch verbessert. Ich würde sie jedem empfehlen.
Samantha KlichAndroid-Nutzerin
Wow, ich bin wirklich begeistert. Ich habe die App einfach mal ausprobiert, weil ich sie schon oft beworben gesehen habe und war absolut beeindruckt. Diese App ist DIE HILFE, die man für die Schule braucht und vor allem bietet sie so viele Dinge wie Übungen und Lernzettel, die mir persönlich SEHR geholfen haben.
AnnaiOS-Nutzerin
Informatik2,305 aufrufe·Aktualisiert May 27, 2026·2 SeitenHTML und CSS Grundlagen
S
Selin Ben@selinbenh_fde6c
HTML und CSS sind die Grundbausteine jeder Website, die du täglich nutzt! HTML erstellt die Struktur und den Inhalt, während CSS für das schöne Aussehen sorgt.
1
of 2Melde dich an, um den Inhalt zu sehen. Kostenlos!
- Zugriff auf alle Dokumente
- Verbessere deine Noten
- Schließ dich Millionen Schülern an
HTML Grundlagen und Dokumentaufbau
Stell dir vor, du baust ein Haus - HTML ist wie das Gerüst, das alles zusammenhält. Mit der Hypertext Markup Language erstellst du die komplette Struktur deiner Website, während CSS (Cascade Style Sheet) später für das coole Design sorgt.
Jedes HTML-Dokument startet mit <!DOCTYPE html> - das sagt dem Browser "Hey, hier kommt eine HTML-Seite!". Das Wurzelelement <html> umschließt dann alles andere. Die Sprache gibst du mit lang="de" an.
Der Head-Bereich ist unsichtbar für Besucher, aber wichtig für Browser und Suchmaschinen. Hier steht der <title>, den du oben in der Browser-Registerkarte siehst. Im Body kommt dann der sichtbare Inhalt: Überschriften (<h1> bis <h6>), Textabschnitte (<p>) und Zeilenumbrüche (<br>).
Tipp: Denk an HTML wie an ein Buch - Head ist das Inhaltsverzeichnis, Body sind die Kapitel!
2
of 2Melde dich an, um den Inhalt zu sehen. Kostenlos!
- Zugriff auf alle Dokumente
- Verbessere deine Noten
- Schließ dich Millionen Schülern an
HTML-Elemente und Tabellen
Mit HTML-Elementen machst du deine Website lebendig! Bilder fügst du mit <img src=""> ein - das Bild muss im gleichen Ordner wie dein HTML-Dokument liegen. Der alt-Text ist super wichtig, falls das Bild mal nicht lädt.
Links erstellst du mit <a href=""> - damit verbindest du verschiedene Seiten miteinander. Für Listen hast du zwei Optionen: <ol> für nummerierte Listen (1, 2, 3...) und <ul> für einfache Aufzählungen mit Punkten.
Tabellen sind perfekt für strukturierte Daten. Das <table>-Element umschließt alles, <tr> erstellt Zeilen und <td> die einzelnen Zellen. Mit CSS kannst du dann Rahmen hinzufügen (border-style: solid) und Farben ändern (background-color, color).
Merke: Tabellen sind nicht für Layouts gedacht - nur für echte Daten wie Stundenplan oder Noten!
Wir dachten schon, du fragst nie...
Was ist der Knowunity KI-Begleiter?
Unser KI-Begleiter ist ein speziell für Schüler entwickeltes KI-Tool, das mehr als nur Antworten bietet. Basierend auf Millionen von Knowunity-Inhalten liefert er relevante Informationen, personalisierte Lernpläne, Quizze und Inhalte direkt im Chat und passt sich deinem individuellen Lernweg an.
Wo kann ich die Knowunity-App herunterladen?
Du kannst die App im Google Play Store und im Apple App Store herunterladen.
Ist Knowunity wirklich kostenlos?
Genau! Genieße kostenlosen Zugang zu Lerninhalten, vernetze dich mit anderen Schülern und hol dir sofortige Hilfe – alles direkt auf deinem Handy.
Ähnlicher Inhalt
Beliebtester Inhalt: HTML-Element
2Beliebtester Inhalt in Informatik
9Beliebtester Inhalt
9Findest du nicht, was du suchst? Entdecke andere Fächer.
Schüler lieben uns — und du auch.
4.6/5App Store
4.7/5Google Play
Die App ist sehr einfach zu bedienen und gut gestaltet. Ich habe bisher alles gefunden, wonach ich gesucht habe, und konnte viel aus den Präsentationen lernen! Ich werde die App definitiv für ein Schulprojekt nutzen! Und natürlich hilft sie auch sehr als Inspiration.
Stefan SiOS-Nutzer
Diese App ist wirklich super. Es gibt so viele Lernzettel und Hilfen [...]. Mein Problemfach ist zum Beispiel Französisch und die App hat so viele Möglichkeiten zur Hilfe. Dank dieser App habe ich mich in Französisch verbessert. Ich würde sie jedem empfehlen.
Samantha KlichAndroid-Nutzerin
Wow, ich bin wirklich begeistert. Ich habe die App einfach mal ausprobiert, weil ich sie schon oft beworben gesehen habe und war absolut beeindruckt. Diese App ist DIE HILFE, die man für die Schule braucht und vor allem bietet sie so viele Dinge wie Übungen und Lernzettel, die mir persönlich SEHR geholfen haben.
AnnaiOS-Nutzerin