Hilfe:Tabellen: Unterschied zwischen den Versionen

Aktuelle Version vom 10. November 2020, 18:06 Uhr

Tabellen sind ein gutes Mittel, um gleichartige Informationen übersichtlich zu gestalten.

Auch die gute Beeinflussung der graphischen Gestaltung mit Hilfe von Tabellen sorgt für deren reichliche Verwendung, auch wenn dies nicht ihrer Idee entspricht: Tabellen sollten verwendet werden, wenn zwischen Tabellenzellen und ihren Zeilen und Spalten semantische Beziehungen bestehen. Sie dienen beispielsweise dann ihrem Zweck, wenn die Informationen in gewisser Weise sortiert werden können, z. B. nach Jahreszahlen oder mit alphabetischer Anordnung.

Andererseits sind Tabellen komplizierter zu überarbeiten als normaler Text. Deshalb sollten sie nur in Fällen eingesetzt werden, wo mit ihrer Hilfe tatsächlich eine bessere Übersicht erzielt wird oder in denen die Sortierung klar ist.

Die hier vorgestellten Beispiele können auch von Benutzern ohne besondere Kenntnisse in HTML, CSS und Javascript angewendet werden.

Grundgerüst

Wiki-Code für ein einfaches Grundgerüst, deren Formatierung bereits durch die Klasse wikitable voreingestellt ist. Diese Klasse funktioniert auch in anderen Wikis:

Kopfzeile Überschrift Spalte 1	Kopfzeile Überschrift Spalte 2
Zeile 1, Zelle 1	Zeile 1, Zelle 2
Zeile 2, Zelle 1	Zeile 2, Zelle 2

{| class="wikitable" border="1"
|-
! Kopfzeile Überschrift Spalte 1
! Kopfzeile Überschrift Spalte 2
|-
| Zeile 1, Zelle 1
| Zeile 1, Zelle 2
|-
| Zeile 2, Zelle 1
| Zeile 2, Zelle 2
|-
|}

Maddraxikon-Standard-Tabelle

Die maddraxikon standard table ist eine Klasse, die extra für das Maddraxikon geschrieben wurde. Das bedeutet, dass sie einerseits nur im Maddraxikon angewendet werden kann und andererseits für ein einheitliches Erscheinungsbild sorgt und keine umfangreiche Einzelformatierung benötigt. Andere Wikis können mit diesem Quelltext nichts anfangen. Es gibt sie in zwei Ausführungen: einfach (maddraxikon_std_table) und sortierbar nach Spalten (maddraxikon_std_table sortable).

Bei beiden Ausführungen erfolgt die Sortierung innerhalb der Spalten stets nach Anfangsbuchstaben bzw. Zahlen. Die Tabellenbreite ist auf 100% festgelegt, unabhängig von der Spaltenbreite.

Spaltenbreite variabel

Im folgenden Beispiel ist die Spaltenbreite nicht festgelegt und passt sich automatisch an:

Name	Volk	Auftritt	Quellen
Agat'ol (†)	Hydrit	Mar'os-Jünger	MX 184
Angelis, Leto Jolar (†)	Marsianer	Mitglied der Erd-Mission	MX 150
Aruula	Barbarin	Begleiterin von Matthew Drax, Königin der Dreizehn Inseln	MX 001

{| class="maddraxikon_std_table sortable"
!Name
!Volk
!Auftritt
!Quellen
|----
|[[Agat'ol]] (†)
|[[Hydrit]]
|[[Mar'os (Legende)|Mar'os]]-Jünger
|[[Quelle:MX184|MX 184]]
|----
|[[Leto Jolar Angelis|Angelis, Leto Jolar]] (†)
|[[Marsianer]]
|Mitglied der [[Erd-Mission]]
|[[Quelle:MX150|MX 150]]
|----
|[[Aruula]]
|[[Barbar]]in
|Begleiterin von [[Matthew Drax]], Königin der [[Dreizehn Inseln]]
|[[Quelle:MX1|MX 001]]
|----
|}

Spaltenbreite festgelegt

Möchte man die Spaltenbreite festlegen, sieht der Quelltext folgendermaßen aus:

Name	Volk	Auftritt	Quellen
Agat'ol (†)	Hydrit	Mar'os-Jünger	MX 184
Angelis, Leto Jolar (†)	Marsianer	Mitglied der Erd-Mission	MX 150
Aruula	Barbarin	Begleiterin von Matthew Drax, Königin der Dreizehn Inseln	MX 001

{| class="maddraxikon_std_table sortable"
!width="20%" | Name
!width="20%" | Volk
!width="40%" | Auftritt
!width="20%" | Quellen
|----
|[[Agat'ol]] (†)
|[[Hydrit]]
|[[Mar'os (Legende)|Mar'os]]-Jünger
|[[Quelle:MX184|MX 184]]
|----
|[[Leto Jolar Angelis|Angelis, Leto Jolar]] (†)
|[[Marsianer]]
|Mitglied der [[Erd-Mission]]
|[[Quelle:MX150|MX 150]]
|----
|[[Aruula]]
|[[Barbar]]in
|Begleiterin von [[Matthew Drax]], Königin der [[Dreizehn Inseln]]
|[[Quelle:MX1|MX 001]]
|----
|}

Zeilen zusammenfassen

Beispiel 1

Zugehörigkeit	Beschreibungen	Quellen
Text, den man einfügen könnte	Unterbegriff oben	Quelle:MX1
Text, den man einfügen könnte	Unterbegriff unten	Quelle:HC001
anderer Begriff	seine Beschreibung	seine Quelle

{| class="madraxikon_std_table"
!width="30%" | Zugehörigkeit
!width="50%" | Beschreibungen 
!width="20%" | Quellen
|---
| rowspan="2" |Text, <br>den man einfügen könnte
|Unterbegriff oben
|Quelle:MX1
|---
|Unterbegriff unten
|Quelle:HC001
|---
|anderer Begriff 
|seine Beschreibung
|seine Quelle
|---
|}

Beispiel 2

Zugehörigkeit	Beschreibungen	Quellen
A	Beschreibung von A	Quelle:MX1
B	Beschreibung von B	Text, den man einfügen könnte
C	Beschreibung von C
D	Beschreibung von D

{| class="maddraxikon_std_table"
!width="30%" | Zugehörigkeit
!width="50%" | Beschreibungen 
!width="20%" | Quellen
|---
|A
|Beschreibung von A
|Quelle:MX1
|---
|B
|Beschreibung von B
| rowspan="3" |Text, <br>den man einfügen könnte
|---
|C
|Beschreibung von C
|---
|D
|Beschreibung von D
|---
|}

Spalten und Zeilen zusammenfassen

Ein komplexeres Beispiel zeigt der Quelltext des Artikels Zyklen und Großzyklen.

Text in Spalten unterteilen

Wenn man viele kurze Zeilen hat, kann man sie in Spalten nebeneinander darstellen. Zwischen die Spalten mit Text sollte man Spalten der Breite 0% und ohne Text einfügen. Dadurch werden die anderen Spalten auf Abstand gehalten.

Spaltenanzahl und Spaltenbreite können leicht angepasst werden. Soll es sich um Spalten mit gleicher Breite handeln, so ist ein entsprechender Teil von 100% anzusetzen – bei drei Spalten also 33%. VORSICHT: Wenn eine Zeile zuviel Text enthält, wird er nicht richtig dargestellt.

A
B
C

D
E
F

G
H
I

J
K
L

{| valign="top" border="0" cellpadding="5" cellspacing="2"
| width="25%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
* A
* B
* C
| width="0%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
| width="25%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
* D
* E
* F
| width="0%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
| width="25%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
* G
* H
* I
| width="0%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
| width="25%" style="background:#FFFFFF; border: 0px solid #000000;" valign="top" |
* J
* K
* L
|}

Parameter	Bedeutung	Notwendig	Vorgabe
width	Gesamtbreite (Tabellenkopf)	nein	"100%"
border	Rahmen (Tabellenkopf)	nein	"0"
padding	Innenabstand (Spalten)	nein	"10"
valign	Vertikale Ausrichtung (Spalten)	nein	"top"
align	Horizontale Ausrichtung (Spalten)	nein	"left"
col1	Inhalt der 1. Spalte	ja	– keine –
col2	Inhalt der 2. Spalte	ja	– keine –
col3 bis col10	Inhalt der 3. bis 10. Spalte	nein	– leer (fehlt dann) –

Bitte die "|" zwischen "width", "valign", "align", "padding" und "border" beachten. Die Werte für diese Parameter sind mit HTML identisch.

Nicht notwendige Parameter können ganz weggelassen werden.

Weblinks

Anleitung des Sternenfaust-Wiki
Anleitung der Perrypedia
Anleitung der Wikipedia (deutschsprachig)
Details zum Thema Tabellenlayout und CSS würden den Umfang dieser Seite sprengen. Näheres siehe unter der Tabellensektion der SelfHTML-Dokumentation.
Eine englischsprachige Anleitung zum Erstellen von Tabellen findet sich unter meta.wikipedia.org.

Handbuch → Problemlösungen