PDA

Vollständige Version anzeigen : Web-Design Dynamische Größenverhältnisse


Mew
23.10.05, 10:47
Hi,

ich muss euch jetzt einfach mal mit einer sehr wichtigen Frage nerven :notok: .
Ihr kennt ja bestimmt alle die ganzen zahrleichen PHP Homepages, wo in den meisten Fällen einen Kopf, linke Navigation, Content, rechte Navigation und noch einen Fuß gibt.
Alles schön und gut, doch eine Sache verstehe ich nicht an dem ganzen:
Wie schafft man es, dass sich die komplette Seite (also alles außer der Kopf-Teil), sich je nach Auflösung/Größe des Browserfensters anpasst? Damit mein ich, dass, wenn der Content z.b. richtig schön lang ist (Beispiel: eine Newsseite), jedoch die Navigationen natülrich nicht so in die Länge gehen, aber der Background der beiden trotzdem "nachzieht" und am Ende der Länge, nachdem der Content beendet ist, sich der Fuß-Tei. absetzt.

Beispielseite:
http://www.PlanetQuake.de

Je nach Fülle der einzelnen PHP pages, verändert sich die komplette Länge der Seite.
Ich hoffe man hat mich verstanden, da's irgendwie komisch zu erklären ist.
In HTML und PHP kenne ich mich aus, doch ich komme an dieser Stelle nicht hinter. Ich tippe aber mal, dass man es mit irgendwelchen Eben (<div>) bewerkstelligen kann... mhm :/

Vielen vielen Dank schonmal im vorraus!!

Gruß,
Mew

Rythem
23.10.05, 13:43
hmm viel kann ich dir leider dazu nicht sagen da ich von Homepages bauen so gut wie keine Ahnung von habe. Aber ich würde mir an Deiner stelle einfach mal ein bis drei Webtemplates runter laden und diese mal genauer betrachten wie es dort gelöst worden ist hab ich auch gemacht um einwenig mehr zu verstehen von den ganzen kram bloss wenig zeit dafür :(

für Templates hatte ich http://www.chillys-world.de für Counterstrike HP (http://www.chillys-world.de/part6/index.php?site=files)

vektorpixel
23.10.05, 15:24
Hallo Mew. Also ich habe mir darüber auch schon gedanken gemacht. Ich bin zum Schluss gekommen, dass das nur auf eine Weise möglich ist. Ich versuch es mal zu erklären.

Man muss die Homepage mit Tabellen "bauen". Danach muss man den mittleren Teiln einer Tabelle mit angaben wie width="100%" usw. ausstatten. Also mit relativen und nicht mit festen Werten wie z.B px. Unten mal ein Beispiel:


<table width="100%" height="100%">
<tr>
<td colspan="3"><!--Hier käme z.B der Header rein--></td>
</tr>
<tr>
<td colspan="3"><!--Hier zum Beispiel die Navigation--></td>
</tr>
<tr>
<td height="100%" ><!--Achtung: Hier der Linke teil der Seite, der elastisch ist.--></td>
<td height="100%"><!--Achtung hier der mittlere Teil der Seite der elastisch ist--></td>
<td height="100%"><!-- Achtung Hier der rechte Teil der Homepage, der elastisch ist--></td>
</tr>
<tr>
<td colspan="3"><!--So und hier noch der Footer--></td>
</tr>
</table>


Hmm ich weiss halt nicht ob das vestanden worden ist?! In den Teil der jeweils elastisch gebaut ist, packst du dann dein PHP News-Script oder was auch immer. So passt sich die Tabelle immer der Länge der Nachrichten an. (oder sollte sie zumindest)

Mew
23.10.05, 17:36
Aaaah!! DANKE!!!!!
Also waren es doch die Tabellen!! :)
Irgendwen den ich auch mal danach fragte, war nämlich der Annahme man müsse das mit <div> layern regeln...und die Seite, wo es angeblich beschrieben wäre, habe ich Null gecheckt.
Dank deines Code-Beispiels, hab ichs nun verstanden und schon mit Erfolg selbst hinbekommen!...
Vielen vielen Dank vektorpixel! Ich hab mich echt schon wundprobiert wie das nu funktioniert!! ;)

phoenix
23.10.05, 18:03
zusätzlich besteht die seite die du als beispiel gepostet hast aus einem frameset. damit ist die navigation, header, content jeweils eine eigene seite, wo man dann eben mit den tabellen mal mit fixgrösse, mal mit %angabe die seite dynamisch anpassbar hinbekommt.

vektorpixel
22.05.06, 23:23
Update: Die Gestaltung der Website sollte man am besten mit CSS vornehmen. Sprich, auch mit CSS kann man erreichen, dass sich die Länge / Breite der Homepage dem Inhalt anpasst.

Tabellen sind eigentlich nicht zum Layouten gedacht. (man lernt immer dazu :ok: ) Nähere Informationen zur Gestaltung einer Website mit CSS findet man unter SelfHTML (http://de.selfhtml.org/css/layouts/einfuehrung.htm)