jetzt auch als Video-Kurs

CSS Spalten Layout

Als folgende Aufgabe wird dieses 2-Spalten-Layout über CSS (und natürlich HTML) nachgebaut:

Benötigtes Bildmaterial für Beispiel 2-Spalten-Layout

Hintergrund für Spalte Steuerung

fertiges Bild für Kopf

Bild aus Inhalt

Hintergrundgrafik für blauen Bereich links und rechts von der Homepage (Farbe: #92C6ED)

Rohdaten zum selber erstellen des Kopfes

Bilder von Tübingen als Imressionen

Bilder von Tübingen (ZIP)

vorheriges Kapitel: fertiges Beispiel

nächstes Kapitel: Beispiel 2 Spalten Layout

• Startseite
  • Vorwort
  • Neuigkeiten
  • Videokurs 11 Stunden
• HTML Tutorial für Anfänger
  • benötigte Software
  • erste HTML-Seite
  • Grundlagen - HTML-TAG
  • Absatz
  • Überschriften
  • html Editor
  • Seitenaufbau
  • Text fett, kursiv
  • Schachteln von HTML-TAGs
  • unterstreichen
  • validieren HTML-Seite
  • Sauberer HTML-Code
  • Listen, Aufzählungen
  • Definitionsliste
  • Attribute bei HTML-TAGs
  • Links, Hyperlinks
    • Dateinamen
    • interne Links
    • externe Links
    • Steuerung erstellen
    • Verzeichnisse
  • erzwungener Umbruch
  • Trennlinie, Attribute
  • Bilder u. Grafiken I
  • HTML Farben
  • Tabellen
  • Online stellen
  • HTML Befehle Übersicht
• CSS lernen
  • Trennung Inhalt Design
  • Aufbau CSS Befehle
  • CSS in HTML einbinden
  • CSS einsetzen
  • Box-Modell
  • CLASS und ID
  • DIV und SPANs
  • Design per CSS - float
  • Steuerung per CSS
  • Block- u. Inline-Elemente
  • Bilder und Hintergrund
  • CSS Befehle Übersicht
  • CSS Tipps und Tricks
  • CSS-Layout-Generator
• Projekt Beispielwebsites
  • Vorstellung Projekte
  • Layout über CSS
    • Design über CSS
    • fertiges Beispiel
  • 2 Spalten Layout
    • Beispiel 2 Spalten Layout
  • Layout über Tabellen
• Fortgeschrittene
  • Fortgeschrittene
  • hoch-tief, groß-klein
  • Breadcrumbs-Navigation
  • Farben II
  • Bilder u. Grafiken
  • Bildbearbeitung mit GIMP
  • Formulare
  • Frames
  • bevorz. Software
  • JavaScript
  • Metatags
  • Suchmaschinen
  • Domainnamen
  • Provider & Domains
  • kostenloser Webspace und seine Kosten
  • Recht
  • Usability
  • HTML 5
  • Geld verdienen im Internet
  • Tipps & Tricks
• Forum
  • ins Forum
• Diverses
  • WYSIWYG-Editoren
  • Software
  • Bücher
  • Links
  • Referenz Sonderzeichen
  • Maßeinheiten
  • geschl. Benutzerkreis
  • Abk. - Abkürzungen
  • favicons erstellen
  • Leserstimmen
  • Helfen Sie mit...
  • Datenschutzerklärung
  • Archiv
  • Impressum