Benutzer:Gnushi: dot:Pse

(Hier entsteht ein Hilfetext zum Thema Tabellen.)


Allgemeines zu Tabellen

Bearbeiten

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

Bearbeiten
 {|
 |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

Bearbeiten
{| 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

Bearbeiten

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

Bearbeiten
{| 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

Bearbeiten

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

Bearbeiten

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

Bearbeiten

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

horizontal

Bearbeiten

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

Bearbeiten

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

Bearbeiten

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

Bearbeiten
{| 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

Bearbeiten

Platz zwischen Zellen

Bearbeiten

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

Bearbeiten

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

Bearbeiten

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

Bearbeiten

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