Hilfe:Start/ Tabellen verschachtelt
- Allgemein: Willkommen – Kommentieren – Korrigieren / Bearbeiten – Anleitung für Nachnutzung
- Menü-Übersicht: Lesen und Bearbeiten – Diskussionsseiten – Bearbeitung abschließen – Menüpunkte links – Datei hochladen
- Persönliches Menü: Benutzerseite – Eigene Diskussionsseite – Einstellungen – Beobachtungsliste – Eigene Beiträge – Anmelden
- Seiten gestalten: Wiki-Markup mit Beispiel1 – Überschriften, Gliederung – Vorlagen – Schrift (HTML) – Hervorhebungen (HTML) – Rahmen (HTML)
- Überblick zu Tabellen: Tabellen – Tabellenkopf – Positionierung auf der Seite – Tabellen gestalten – Verschachtelte Tabellen
Die Zellen einer Tabelle müssen nicht ausschließlich mit Text gefüllt sein. Auch Bilder und andere Tabellen können eine Tabelle füllen. Solche verschachtelten Tabellen sind vielseitig verwendbar.
- Tabellen belegen mitunter nur einen Teil der Seitenbreite, so dass die Breite des Fensters bzw. des Papiers schlecht ausgenutzt wird.
- Mitunter soll eine Tabelle oder ein Bild zur Illustration eines Textes dienen. Tabelle oder Bild neben dem Text zu platzieren dient der Übersicht.
- Es ist mitunter schwierig, Komponenten wie Tabellen, Bilder oder Textabschnitte auf eine gewünschte Weise auf der Seite anzuordnen. Je nach Breite des Browserfensters verrutschen die Komponenten auf eine kaum vorhersagbare Weise. Will man die Seite ausdrucken, kommen die Seitenumbrüche als unberechenbarer Faktor hinzu. Insbesonders Bilder werden oft vom dazugehörigen Text getrennt. Die Einbettung in eine Tabelle kann das Problem lösen.
Man sollte darauf achten, dass die Tabelle nicht zu breit wird, weil es Darstellungsprobleme auf geringer auflösenden Bildschirmen (z. B. von Smartphones) geben kann, die bis zur Unlesbarkeit führen können.
Beispiel
| A | {|class="wikitable" | Umfassende Tabelle |
| B | | | erste Tabellenzelle (entspricht <td>...</td>) |
| 11 | |width="100px" |[[bild:Torchlight help.png|40px]] | Kästchen für das Bild 150px breit |
| C | | | zweite Tabellenzelle (entspricht <td>...</td>) |
| 21 | {| class="wikitable" | Beginn der Tabelle im vierten Feld |
| 22 | |Z1S1||align="right" width="80px" |Z1S2 | Z1S2 breiter und rechtsbündig |
| 23 | |- | |
| 24 | |Z2S1||Z2S2 | |
| 25 | |} | Ende des zweiten Feldes |
| D | | | dritte Tabellenzelle (entspricht <td>...</td>) |
| 31 | === Text === | |
| 32 | Es kann auch Text ... was passiert! | |
| E | |} | Hier endet die umfassende Tabelle |
So sieht es aus:
|
|
Text[Bearbeiten]Es kann auch Text in einem Kästchen stehen. |
Bemerkungen
- Die mit den Buchstaben A bis E bezeichneten Zeilen gehören zur übergeordneten Tabelle, gewissermaßen zur „Infrastruktur“.
- In Zeile 12 wurde die Breite der Zelle festgelegt, damit neben dem Bild mehr Platz ist. Mit
align="left"oderalign="center"oderalign="right"könnte die Position des Bildes festgelegt werden. - In Zeile 22 sorgt das
width="80px"dafür, dass die zweite Spalte breiter wird.align="right"verschiebt Z1S2 in dem breiten Kästchen nach rechts. - Beim grünen Text in Zeile 11 bzw. beim blauen Text in Zeile 22 handelt es sich um jeweils eine Zeile.
Zusatzhinweis
Gemäß einer neuen Philosophie des W3C-Konsortiums sollte die Verwendung von Tabellen für Layoutzwecke oder für die Platzierung von Objekten auf Webseiten vermieden werden. Es wird ein "tableless web layout" angestrebt. Auf Wikibooks steht dafür die Vorlage:Mehrspaltenlayout zur Verfügung. Einzelheiten dazu übersteigen den Zweck dieser Hilfe-Seiten.