Einstieg in das Thema
Was brauchst du als Basiswissen?
Grundlagen in HTML und CSS sind wichtig.
Worum geht es?
Wenn man Hintergründe einfärbt oder Bilder einfügt, stößt die Schrift oft an den Rand. Das sieht nicht schön aus. Bei eingefärbten Boxen und Absätzen ist auch ein Abstand zwischen den Elementen sinnvoll.
Nun geht es darum, wie man diese Abstände angibt, bei Bedarf Ränder hinzufügt und - weil es schön aussieht - die Ecken von Textboxen abrundet.
Was ist das Ziel?
Am Ende kannst du Abstände einstellen und deine Webseite optisch aufwerten.
Erarbeitung
Theorie
Aufgaben zur Erarbeitung
Vertiefung
Komplexe Aufgabe ohne KI
Erstelle unter Nutzung der Vorlage eine Tabelle (2x2 Zellen) und eine Auflistung (drei Einträge). Gib den Zellen einen Innenabstand von 5 Pixeln, den Listeneinträgen ebenso. Prüfe dies, indem du den Einträgen eine Hintergrundfarbe gibst. Stelle den Außenabstand zwischen Aufzählung und Tabelle auf 8 Pixel.
Lasse dein Resultat von Nachbarn oder der KI prüfen. Was waren deine beiden größten Fehler?
Zusammenfassung
Was muss man wissen/können?
Du weißt,
- dass man Abstände innen und außen einstellen kann,
- wie man das genau macht,
- dass das auch nur in ausgwählte Richtungen klappt.
Weiterhin kannst du
- Ränder setzen,
- denen eine Farbe geben und
- Ecken abrunden.
Was können anschließende Themen sein?
Zu CSS gibt es noch viel zu erzählen. Inhaltlich belassen wir es dabei. Aber CSS-Deklarationen kann man an verschiedenen Stellen platzieren. Das schauen wir uns noch an.
