Div Container

Computer: Software & Programmierung HTML & CSS
#1

Hallo,
ich habe das mit den Div Containern noch nicht ganz raus. Ich hab schon Diverse
Seiten angekuckt und durchgelesen, mir fehlt aber ein anschauliches Bespiel das
ich nachmachen kann.

Normalerweise habe ich das mit Tabellen geregelt, da die aber veraltet sein sollen
möchte ich das ganze nun mit Div-Containern versuchen…

Die Tabelle soll, möglichst mit Rand, so aussehen:

Spalte 1, Zeile 1- Spalte 2, Zeile 1 - Spalte 3, Zeile 1 - Spalte 4, Zeile 1
Spalte 1, Zeile 2
Spalte 1, Zeile 3
Spalte 1, Zeile 4
Spalte 1, Zeile 5

Könnt Ihr mir bitte nochmal helfen ?

#2

Welches Problem willst du den genau lösen?

Wenn Du eine Tabelle gestalten willst, dann macht man das nachwievor als Tabellle. Veraltet/Verpönt ist nur, die Seitengestaltung als Tabelle anzulegen.

Gruß,
Max

#3

Hi,

wie schon erwähnt,

genau so ist es. Gemeint ist damit, dass man den Kopfbereich, die Navigation und den Inhaltsbereich durch Anlegen von Tabellen umsetzt.

Gruß
Christa

P. S. Das ist nur als Ergänzung zu Max’ Beitrag gedacht. :smile:

#4

Hallo,

die grundsätzliche Struktur einer Internetseite (z.B. Kopfzeile, Hauptmenü, Seitenmenü, Fußzeile) stellt man heute nicht mehr mit Tabellen oder gar iFrames dar. (Obwohl es sogar noch Leute gibt, die Seiten gegen Bezahlung erstellen und auf dieses überholte Design setzen…) Inzwischen unterteilt man die Gruppen der Seite in

-Container. Deren Aussehen (Anordnung, Größe, Schrift etc.) legt man mit CSS-Befehlen ab.

Der Vorteil: man trennt Inhalt und Design der Seite schon recht gut. Somit kann man zum Beispiel schneller auf responsives Design umstellen (eine Anpassung der Darstellung optimiert auf verschiedene Geräte (großer Bildschirm am PC, kleiner Bildschirm am Netbook oder Tablet, Mini-Bildschirm am Smartphone). Zudem ist man ein wenig variabler in der Anordnung der Elemente im Quelltext. So kann der eigentliche Inhalt vor die Menüs gestellt werden, was eine bessere Bewertung in den Suchmaschinen nach sich ziehen kann.

Zum Üben würde ich die simpelste Seite der Welt bauen:

  1. Ein
    für Überschrift und Logo
  2. Ein
    für den Inhalt
  3. Ein
    für das Menü links
  4. Ein
    für die Fußzeile

    Eine gute Sammlung und Erläuterung aller Befehle und Elemente bietet aus meiner Sicht http://selfhtml.org

    Wenn man übrigens reine Daten darstellen will, tut man das nach wie vor in einer Tabelle. Wobei man die einzelnen Elemente der Tabelle mit CSS beschreibt.

    Grüße

#5

Danke für Eure Antworten…

Ich habe eine Kochseite und möchte eine Tabelle mit Vorspeise, Hauptspeise,
Vegetarisch und Dessert machen. In der Tabelle sollen nur die Rezeptenamen
drinn sein die auf das Rezept im Kochforum auf www.köche-nord.de verweisen.
Das ganze soll sich mittels Java-Script wöchentlich aktualisieren (jede Woche eine
Andere Datei) … das kriege ich hin. Die frage war nur ob ich das mit einem Container
machen soll oder mit einer Tabelle.

#6

Das würde ich in der Tat mit einer Tabelle lösen. Eine gleichbleibend gute Formatierung bei wenig Arbeit ist damit einfach zu gewährleisten.

1 Like
#7

Und wie mache ich das dass auf der Startseite von www.köche-nord.de ,
neben dem Text eine vierte Spalte zu sehen ist ? Ich möchte, wie gesagt,
mittels Bild und Link die Wochenrezepte einbinden. Das ist ja die Startseite…
Div Container (und wenn ja wie) oder Teabelle ?

Text und danneben Bild

#8

Die Seite baut ja schon jetzt nicht auf einer Tabelle auf, sondern auf CSS-Beschreibungen und Trennung durch <div>. Also könnte man den jetzt rechten Container schmaler machen und in den entstehenden Platz für einen rechten Container benutzen, der dann die Tabelle enthält.

Ob das Ergebnis dann gut aussieht, ist wieder eine andere Frage.

#9

Wie würdest Du das denn machen ? Untereinander ? (ich meine wenn Du meinst
das dass nicht gut aussieht…

Und ich habe leider doch noch was:
Ich habe gerade mal auf http://www.web-toolbox.net/webtoolbox/index.htm
gekuckt … da habe ich die JavaScripte her. Leider hat der kein Wochenplaner
sondern nur TagesDatein (Täglich wechselnd. Habt Ihr eine Idee wie ich Dateien
(und Arbeit) spare und nur eine Datei via JavaScript pro Woche anzeige ? Das
Jahr hat bekandlich 53 Wochen…

Und wie öffne ich ein Fenster (Pop-Up) und mache das der Link in der
Hauptseite geöffnet wird ?