Benutzer:Gnushi: dot:Pse

(Hier entsteht ein Hilfetext zum Thema Tabellen.)

Allgemeines zu Tabellen

Tabellen sind ein grafisches Hilfsmittel, um Informationen in Zeilen und Spalten zu schreiben. Sie werden mit {| begonnen, mit |} beendet. Jede neue Tabellenzeile wird durch |- eingeleitet. Innerhalb einer Zeile werden zwei Spalten voneinander durch || getrennt.

Tabellen ohne Rahmen

 {|
 |Erste Zeile, Erste Spalte || Erste Zeile, zweite Spalte
 |-
 |Zweite Zeile, Erste Spalte || Zweite Zeile, Zweite Spalte
 |}

Erste Zeile, Erste Spalte	Erste Zeile, zweite Spalte
Zweite Zeile, Erste Spalte	Zweite Zeile, Zweite Spalte

Tabellen mit Rahmen

{| border="2"
 |Erste Zeile, Erste Spalte || Erste Zeile, zweite Spalte
 |-
 |Zweite Zeile, Erste Spalte || Zweite Zeile, Zweite Spalte
 |}

Erste Zeile, Erste Spalte	Erste Zeile, zweite Spalte
Zweite Zeile, Erste Spalte	Zweite Zeile, Zweite Spalte

Zellen verbinden

Zwei Zeilen in einer bestimmten Zeile werden folgendermaßen verbunden:

{| border="1"
 |Erste Zeile, Erste Spalte || Erste Zeile, zweite Spalte
 |-
 | colspan="2" | gesamte Zweite Zeile
 |}

Erste Zeile, Erste Spalte	Erste Zeile, zweite Spalte
gesamte Zweite Zeile

Um nun zwei Zeilen in einer bestimmten Spalte miteinander zu verbinden, dient folgender Code:

{| border="1"
 | rowspan="2"| 1.1 || 1.2 || 1.3
 |-
 | 2.2 || 2.3
 |-
 | 3.1 || 3.2 || 3.3
 |-
 | 4.1 || 4.2 || 4.3
 |}

1.1	1.2	1.3
	2.2	2.3
3.1	3.2	3.3
4.1	4.2	4.3

Tabellenfelder einfärben

{| border="1"
 | bgcolor="0000aa" | 1.1 || 1.2 || 1.3
 |-
 | 2.1 || 2.2 || 2.3
 |-
 | 3.1 ||bgcolor="00aa00" | 3.2 || 3.3
 |-
 | 4.1 || 4.2 || 4.3
 |}

1.1	1.2	1.3
2.1	2.2	2.3
3.1	3.2	3.3
4.1	4.2	4.3

Eine komplette Tabelle läßt sich folgendermaßen einfärben, wobei wir auch gleich die Vordergrundfarbe ändern:

{| border="1" style="background:blue; color:white"
 | 1.1 || 1.2 || 1.3
 |-
 | 2.1 || 2.2 || 2.3
 |-
 | 3.1 || 3.2 || 3.3
 |-
 | 4.1 || 4.2 || 4.3
 |}

1.1	1.2	1.3
2.1	2.2	2.3
3.1	3.2	3.3
4.1	4.2	4.3

Es stehen unter anderem folgende Farbnamen zur Verfügung. Selbstverständlich können Sie Farben auch immer in der hexadezimalen Schreibweise verwenden.

black	silver	maroon	red
navy	blue	purple	fuchsia
green	lime	olive	yellow
teal	aqua	gray	white

Größe einer Tabelle

Die Größe der Tabelle wird festgelegt durch die Angabe width="x%"

{| border="1" width="60%"
 | Test 1 || Test 2 || Test 3
 |-
 | Test 4 || Test 5 || Test 6
 |}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

Alternativ kann man auch absolute Werte verwenden.

Größe von Tabellenzellen

Sie können in der ersten Zeile der Tabelle einen Parameter width="x%" bestimmen lassen, wie breit die Tabellenzeile wird. Die Summe der einzelnen Spaltbreiten muss nicht 100% ergeben, die Tabelle wird dann kleiner gezeichnet.

{| border="1"
 | width="50% | Test 1 || width="30%" | Test 2 || width="10%" | Test 3
 |-
 | Test 4 || Test 5 || Test 6
 |}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

Auch die Tabellenhöhe ist verhandelbar. Hierzu dient height="y", wobei hier relative Angaben keinen Sinn ergeben:

{| border="1"
 | Test 1 || Test 2 || Test 3
 |-
 | height="50" | Test 4 || Test 5 || Test 6
 |-
 | height="100" | Test 7 || Test 8 || Test 9
 |}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6
Test 7	Test 8	Test 9

Textanordnung

Hier geht es um die Anordnung von Text innerhalb einer Tabellenzelle.

horizontal

Text kann mit align und einem Parameter:

• left
• right
• center,

horizontal ausgerichtet werden:

{| border="1" width="60%"
 | align="left" | Test 1 || Test 2 || align="center" | Test 3
 |-
 | align="right" | Test 4 || Test 5 || Test 6
 |}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

vertikal

Um Text innerhalb einer Zelle nach oben/unten auszurichten, dient valign in Verbundung mit einem Parameter:

• top
• middle
• bottom,

{| border="1"
 |- valign="top"
 | height="50" | Test 1 || Test 2 || Test 3
 |- valign="middle"
 | height="50" | Test 4 || Test 5 || Test 6
 |- valign="bottom"
 | height="50" | Test 4 || Test 5 || Test 6
 |}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6
Test 4	Test 5	Test 6

Tabellenanordnung

Tabellen können mittels align und dem Parameter

• left (standard)
• center
• right,

ausgerichtet werden.

{| border="1" width="50%" align="center"
|-
| Test 1 || Test 2 || Test 3
|-
| Test 4 || Test 5 || Test 6
|}

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

Test 1	Test 2	Test 3
Test 4	Test 5	Test 6

Spaltenköpfe

{| border="1"
 !A
 !B
 !C
 | 1.1 || 1.2 || 1.3
 |-
 | 2.1 || 2.2 || 2.3
 |-
 | 3.1 || 3.2 || 3.3
 |}

A	B	C
1.1	1.2	1.3
2.1	2.2	2.3
3.1	3.2	3.3

Zwischenraum

Platz zwischen Zellen

Mit cellspacing kann der Platz zwischen den Zellen verändert werden.

{| border="1" cellspacing="1"
|-
| 1.1 || 1.2 || 1.3
|-
| 2.1 || 2.2 || 2.3
|}

1.1 1.2 1.3 2.1 2.2 2.3	1.1 1.2 1.3 2.1 2.2 2.3	1.1 1.2 1.3 2.1 2.2 2.3
kein cellspacing	cellspacing="3"	cellspacing="10"

Abstand vom Inhalt

Mit cellpadding wird der Abstand zwischen dem Inhalt der Zelle und dem Rahmen verändert.

{| border="1" cellpadding="3"
|-
| 1.1 || 1.2 || 1.3
|-
| 2.1 || 2.2 || 2.3
|}

1.1 1.2 1.3 2.1 2.2 2.3	1.1 1.2 1.3 2.1 2.2 2.3	1.1 1.2 1.3 2.1 2.2 2.3
kein cellpadding	cellpadding="3"	cellpadding="10"

Schöne Tabelle

Besonders schöne Tabellen erhalten Sie mit {{Prettytable}}. Hier sind schon einige Voreinstellungen getroffen, die Ihnen in den meisten Fällen zusagen dürften.

{| {{Prettytable}}
| Test 1 || Test 2 || Test 3
|-
| Test 4 || Test 5 || Test 6
|}

Test 1 Test 2 Test 3 Test 4 Test 5 Test 6	Test 1 Test 2 Test 3 Test 4 Test 5 Test 6
Einfache Tabelle	Mit {{Prettytable}}

Beispieltabelle: Periodensystem

Hier ist ein Ausschnitt eines Periodensystems der Elemente zu sehen. Damit man den Code noch versteht, wurde das PSE nicht vollständig gezeichnet.

{| {{Prettytable}}
! width="5%" | P
! width="5%" | I
! width="5%" | II
! width="5%" | III
! width="5%" | IV
! width="5%" | V
! width="5%" | VI
! width="5%" | VII
! width="5%" | VIII
|-
|'''1''' 
|align="center" | 1<br/>H
|
|
|
|
|
|
|bgcolor="#63b8ff" align="center"| 2<br/>He
|-
| '''2'''
| bgcolor="#ff4444" align="center" | 3<br/>Li 
| align="center" | 4<br/>Be 
| align="center" | 5<br/>B 
| align="center" | 6<br/>C
| align="center" | 7<br/>N
| align="center" | 8<br/>O
| align="center" | 9<br/>F
| bgcolor="#63b8ff" align="center" | 10<br/>Ne
|-
| '''3'''
| bgcolor="#ff4444" align="center" | 11<br/>Na
| align="center" | 12<br/>Mg
| align="center" | 13<br/>Al
| align="center" | 14<br/>Si
| align="center" | 15<br/>P
| align="center" | 16<br/>S
| align="center" | 17<br/>Cl
| bgcolor="#63b8ff" align="center" | 18<br/>Ar
|}

P	I	II	III	IV	V	VI	VII	VIII
1	1 H							2 He
2	3 Li	4 Be	5 B	6 C	7 N	8 O	9 F	10 Ne
3	11 Na	12 Mg	13 Al	14 Si	15 P	16 S	17 Cl	18 Ar