KompoZer für Fortgeschrittene

HTML-Kästchen erstellen

Ziele

Ein HTML-Kästchen einfügen

Um das erste Kästchen in dein neues HTML-Dokument einzufügen, klicke auf Button Rahmen. Dann erscheint das folgende Fenster:

Einstellungen für HTML-Kästchen

Hier musst du keine weiteren Einstellungen treffen. Bestätige einfach mit OK.
Anschließend siehst du einen Rahmen mit rot-gestricheltem Rand. Diesen beschriftest du am besten gleich. Das erste erstellte HTML-Kästchen soll der Rahmen (engl. wrapper) für deine neue Webseite werden.

Screenshot erstelltes Kästchen mit rotem Rahmen

Erstelle ein HTML-Kästchen 'wrapper'.

Computer-Eule

Einfügen untergeordneter HTML-Kästchen

Füge nun zwei Leerzeilen unterhalb des Kästchens ein. Anschließend ein neues Kästchen und unter dieses noch eine Leerzeile.
Jetzt hast du zwei unabhängige Kästchen. Wir wollen jedoch, dass der wrapper alle unsere anderen Kästchen beinhaltet. Deswegen markierst du nun den zweiten Rahmen und schneidest ihn aus (Strg + A). Füge nach der Beschriftung des ersten Kästchens eine Leerzeile ein, d.h. der Bereich mit rotem Rand vergrößert sich. Jetzt fügst du das zweite Kästchen ein (Strg + V).

Warum wollen wir ein untergeordnetes HTML-Kästchen? Das untergorndete Kästchen übernimmt Eigenschaften von dem Kästchen, das ihn beinhaltet. So kannst du zum Beispiel die Breite aller Elemente verändern, indem du die Breite des äußeren Rahmens veränderst.

  • Erstelle fünf untergeordnete Kästchen im Rahmen 'wrapper'.
  • Beschrifte sie wie im obigen Bild.
Computer-Eule

Dein Dokument sieht aus wie im obigen Bild. Bei dir ist das Kästchen jedoch noch nicht grau hinterlegt.

Wie du das machst, erfährst du im Kapitel Style-Regeln.

Pfeil weiter