Benutzer:Gnushi: dot:Pse
(Hier entsteht ein Hilfetext zum Thema Tabellen.)
Allgemeines zu Tabellen
BearbeitenTabellen 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
BearbeitenZwei 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
BearbeitenDie 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
BearbeitenSie 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
BearbeitenHier geht es um die Anordnung von Text innerhalb einer Tabellenzelle.
horizontal
BearbeitenText 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
BearbeitenUm 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
BearbeitenTabellen 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
BearbeitenPlatz zwischen Zellen
BearbeitenMit 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 |}
|
|
| ||||||||||||||||||
kein cellspacing | cellspacing="3" | cellspacing="10" |
Abstand vom Inhalt
BearbeitenMit 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 |}
|
|
| ||||||||||||||||||
kein cellpadding | cellpadding="3" | cellpadding="10" |
Schöne Tabelle
BearbeitenBesonders 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 |}
|
| ||||||||||||
Einfache Tabelle | Mit {{Prettytable}} |
Beispieltabelle: Periodensystem
BearbeitenHier 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 |