Hilfe:Tabellen

Aus Hortipedia
Wechseln zu: Navigation, Suche

HP Blatt orange 1-1-72 graphic file 1KB.gif

Tabellen sind ein gutes Mittel, um gleichartige Informationen übersichtlich zu gestalten. Auf dieser Seite steht, wie es geht.

Grundlagen

Jede Tabelle beginnt mit einer geschweiften Klammer { gefolgt von einem senkrechten Strich | und endet mit einem Strich | gefolgt von einer geschweiften Klammer }. Die öffnende Klammer muss als erstes Zeichen der Zeile stehen.

Eine neue Tabellenzeile wird mit |- erzeugt. Innerhalb jeder Zeile können beliebig viele Zellen stehen. Eine Zelle wird mit einem senkrechten Strich am Zeilenanfang | eingeleitet. Mit zwei senkrechten Strichen || können mehrere Zellen in einer Textzeile zusammengeschrieben werden. Eine Tabelle mit zwei Tabellenzeilen mit je zwei Zellen sieht im Text so aus:

{|
 |Zelle 1
 |Zelle 2
 |-
 |Zelle 3
 |Zelle 4
 |}

oder so:

{|
|Zelle 1||Zelle 2
|-
|Zelle 3||Zelle 4
|}

Das Ergebnis ist bei beiden das gleiche:

Zelle 1 Zelle 2
Zelle 3 Zelle 4

Überschriften

Mit einem Ausrufezeichen anstatt des Hochstrichs kann man Zellen als Überschriften markieren. Der Inhalt wird dann automatisch fett dargestellt und zentiert.

{|
!Überschrift 1
!Überschrift 2
!Überschrift 3
|-
|Zelle A
|Zelle B
|Zelle C
|}
Überschrift 1 Überschrift 2 Überschrift 3
Zelle A Zelle B Zelle C

Rahmen

Der Befehl, die Tabelle mit Rahmen zu versehen wird in der ersten Zeile direkt hinter dem {| mit border=n (n ist die Stärke des Rahmens) festgelegt. Der Text für die obige Tabelle sieht dann so aus:

{|border=1
|Zelle 1||Zelle 2
|-
|Zelle 3||Zelle 4
|}

und das Ergebnis ist folgendes:

Zelle 1 Zelle 2
Zelle 3 Zelle 4

Es geht natürlich auch fetter, zum Beispiel mit n=5

Zelle 1 Zelle 2
Zelle 3 Zelle 4

Einen einfachen Rahmen bekommt man durch class="wikitable"

{|class="wikitable"
!Zelle 1
!Zelle 2
|-
|Zelle 3
|Zelle 4
|}
Zelle 1 Zelle 2
Zelle 3 Zelle 4

Farben

{|class="wikitable"
|-class="hintergrundfarbe2"
!Zelle 1
!Zelle 2
|-
|Zelle 3
|Zelle 4
|}
Zelle 1 Zelle 2
Zelle 3 Zelle 4
{|class="wikitable" style="border-color:#000000"
|-class="hintergrundfarbe3"
!Zelle 1
!Zelle 2
|-
|Zelle 3
|Zelle 4
|}
Zelle 1 Zelle 2
Zelle 3 Zelle 4
{|class="wikitable" style="border-color:#000000"
|-class="hintergrundfarbe1"
!style="border-color:#000000" | Zelle 1
!style="border-color:#000000" | Zelle 2
|-
|Zelle 3
|Zelle 4
|}
Zelle 1 Zelle 2
Zelle 3 Zelle 4
{|class="wikitable"
!Zelle 1
!Zelle 2
|-
|class="hintergrundfarbe4" style="background-color"|Zelle 3
|Zelle 4
|}
Zelle 1 Zelle 2
Zelle 3 Zelle 4

Spaltenbreite

Die Breite von Spalten kann prozentual zur Gesamtbreite der Tabelle festgelegte werden, oder aber absolut in Pixel. Die Eingabe muss nur in einer Spalte erfolgen, da die darunterstehenden diesen Wert übernehmen.

Prozentual

{|border="1"
 !width="5%"|Spaltenbreite 5%
 !width="40%"|Spaltenbreite 40%
 !width="15%"|Spaltenbreite 15%
 |-
 |Zelle A
 |Zelle B
 |Zelle C
 |}

sieht so aus:

Spaltenbreite 5% Spaltenbreite 40% Spaltenbreite 15%
Zelle A Zelle B Zelle C


Pixel

{|border="1"
 !width="400px"|Spaltenbreite 400 Pixel
 !width="200px"|Spaltenbreite 200 Pixel
 !width="100px"|Spaltenbreite 100 Pixel
 |-
 |Zelle A
 |Zelle B
 |Zelle C
 |}

stellt sich so dar:

Spaltenbreite 400 Pixel Spaltenbreite 200 Pixel Spaltenbreite 100 Pixel
Zelle A Zelle B Zelle C

Zellen vereinigen

Man kann Zellen sowohl über Spalten als auch über Zeilen hinweg vereinigen.

Rowspan

Möchte man, dass eine Zelle über zwei Zeilen reicht, sieht der Text so aus:

{|border=1
 |Zelle 1 
 |rowspan=2|Zelle 2, mit rowspan
 |Zelle 3
 |- 
 |Zelle 4
 |Zelle 5
 |}

und die Tabelle so:

Zelle 1 Zelle 2 Zelle 3
Zelle 4 Zelle 5

Colspan

Für die Vereinigung über zwei Spalten geht man so vor:

{|border=1
!Zelle 1
!Zelle 2
!Zelle 3
|-
|Zelle 4
|colspan="2"|Zelle 5
|}
Zelle 1 Zelle 2 Zelle 3
Zelle 4 Zelle 5

Verschachtelte Tabellen

Wenn es Sinn macht, kann man auch eine Tabelle innerhalb einer anderen anlegen. Der Text dafür sieht so aus:

{|border=1
 |Zelle 1
 |
 {|border=1
 |Zelle A
 |-
 |Zelle B
 |}
 |Zelle 3
 |}

die Tabelle so:

Zelle 1
Zelle A
Zelle B
Zelle 3

Sortierbare Tabellen

Mit dem Befehl class="wikitable sortable" werden Tabellen erzeugt, deren Spalten sich sortieren lassen.

{|class="wikitable sortable"
!Spalte 1
!Spalte 2
|-
|a
|3
|-
|b
|2
|-
|c
|1
|}
Spalte 1 Spalte 2
a 3
b 2
c 1

Beschriftung

Es ist möglich, über einer Tabelle eine Beschriftung einzufügen. Diese erscheint automatisch zentriert und maximal genauso breit wie die Tabelle mit automatischem Zeilenumbruch. Eine Tabelle mit Beschriftung sieht im Text so aus:

{|border=1
 |+Diese Beschriftung ist ziemlich lang, deswegen erfolt ein automatischer Zeilenumbruch.
 |Zelle 1
 |Zelle 2
 |-
 |Zelle 3
 |Zelle 4
 |}

und stellt sich so dar:

Diese Beschriftung ist ziemlich lang, deswegen erfolt ein automatischer Zeilenumbruch.
Zelle 1 Zelle 2
Zelle 3 Zelle 4


Tabellen nebeneinander

Möchten man Tabellen nebeneinader anordnen, kann man das mit float erreichen. Der Befehl margin-right bestimmt den rechten Außenabstand der linken Tabelle.

<div style="float:left; margin-right:1em;">
{|border=1pt
|+Linke Tabelle
!Überschrift 1||Überschrift 2
|-
|Feld 1||Feld 2
|}
</div>

<div style="float:left;">
{|border=1pt
|+Rechte Tabelle
!Überschrift 1||Überschrift 2
|-
|Feld 1||Feld 2
|}
</div>

Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts...

<br style="clear:both">
Linke Tabelle
Überschrift 1 Überschrift 2
Feld 1 Feld 2
Rechte Tabelle
Überschrift 1 Überschrift 2
Feld 1 Feld 2

Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei. Der folgende Text fließt rechts an den Tabellen vorbei.

Möchte man das verhindern, fügt man am Ende der zweiten Tabellen <br style="clear:both"> ein.

Bilder

Mit class kann man Bilder und Bildunterschriften in MediaWiki formatieren. Mit class=rimage wird die Größe der Zelle auf das Bild ausgedehnt, ein kleiner Abstand um das Bild zum Rahmen wird beibehalten, der Text zentriert und das ganze auf die rechte Seite geschoben.

{|border=1pt class=rimage
|Zelle 1
|[[Datei:HP_Blatt_grün_5-5-72_graphic_file_11KB.jpg]]
Bildunterschrift
|-
|Zelle 3
|Zelle 4
|}
Zelle 1 HP Blatt grün 5-5-72 graphic file 11KB.jpg

Bildunterschrift

Zelle 3 Zelle 4

Die Tabelle befindet sich jetzt auf der rechten Seite des Bildschirms und der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei. Sobald die Tabelle endet geht der Text wieder über die ganze Seite. Der darauf folgende Text fließt auf der linken Seite an der Tabelle vorbei.

Weitere Formatierungsmöglichkeiten

Schrift ausrichten

  • mit dem Befehl style="text-align:" kann man die Schrift in einzelnen Zellen, Reihen oder in der kompletten Tabelle ausrichten. Standard ist die Ausrichtung left, weitere Möglichkeiten sind center und right
{|style="text-align:center"

|Zelle 1
|Zelle 2
|-
|Zelle 3
|Zelle 4
|}

{|class="wikitable"
|Zelle 1
|Zelle 2
|-style="text-align:center"
|Zelle 3
|Zelle 4
|}

{|class="wikitable"

|Zelle 1
|style="text-align:right"|Zelle 2
|-
|Zelle 3
|Zelle 4
|}

Zelle 1 Zelle 2
Zelle 3 Zelle 4
Zelle 1 Zelle 2
Zelle 3 Zelle 4
Zelle 1 Zelle 2
Zelle 3 Zelle 4

Siehe auch