Ardapedia:Tabellen: Unterschied zwischen den Versionen
Zeile 214: | Zeile 214: | ||
</div> | </div> | ||
=== | ====Beispiele==== | ||
Um ein Bild mit einer Bildunterschrift anzuzeigen, verwendet man die folgende Struktur. | |||
<nowiki>{| class=rimage | |||
| http://elvelynn.de/Avatar/gollum_5_ttt.jpg Ein langer Text, der unter dem Bild steht. | |||
|}</nowiki> | |||
Das Ergebnis im Text ist: | |||
<div style="border: 1px solid black; margin: 0.5em 3em; padding: 0.5em;"> | |||
{| class=rimage | |||
| http://elvelynn.de/Avatar/gollum_5_ttt.jpg Ein langer Text, der unter dem Bild steht. | |||
|} | |||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas augue. Quisque dapibus, est sed mattis mollis, orci tortor pretium lorem, id feugiat leo tellus eget nibh. Phasellus vel dui. Aliquam sollicitudin ante et dolor. Fusce dictum eros vitae dolor. Aliquam erat volutpat. Etiam pede orci, aliquam sed, mattis quis, bibendum et, metus. Aenean libero. Aliquam erat volutpat. Vestibulum placerat risus quis lacus. Mauris ultrices venenatis est. Etiam accumsan euismod lorem. Ut sollicitudin mi at massa. Morbi aliquam wisi non justo. Suspendisse consectetuer dui vitae wisi. Nulla sed lectus sed lorem rhoncus fringilla. Aenean leo orci, ultrices et, ornare eu, imperdiet non, nunc. Praesent sed purus at quam convallis vehicula. | |||
Sed pede wisi, eleifend vel, lobortis quis, molestie vitae, nisl. Quisque eget urna quis tellus dictum egestas. Nulla facilisi. Aliquam fermentum dapibus enim. Morbi in tellus vitae lacus ultrices volutpat. Aenean tortor ante, consectetuer eget, laoreet lobortis, lobortis id, metus. Fusce id enim. Aliquam erat volutpat. Quisque venenatis erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas vulputate diam in sapien. | |||
</div> | |||
{| | ''Die folgende Funktion funktioniert noch nicht in der deutschen Wikipedia'': | ||
| | Eine Tabelle, mit Flagge mit Bildunterschrift,(flag) sieht im Text so aus: | ||
<nowiki>{| class=flag | |||
| http://elvelynn.de/Avatar/sam_3_fotr.jpg Ein kurzer Text | |||
|}</nowiki> | |||
und stellt sich so dar: | |||
{| class=flag | |||
| http://elvelynn.de/Avatar/sam_3_fotr.jpg Ein kurzer Text | |||
|} | |} | ||
Version vom 18. Juli 2004, 18:32 Uhr
Tabellen sind ein gutes Mittel, um gleichartige Informationen übersichtlich zu gestalten. Jedoch sollte man Tabellen nicht als grafisches Gestaltungsmittel einsetzen, sondern nur dann benutzen, 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, nach Jahreszahlen oder mit alphabetischer Anordnung.
Andererseits sind Tabellen komplizierter als normaler Text. Deshalb sollten sie nur dort eingesetzt werden, wo sie tatsächlich für bessere Übersicht sorgen. Überlege immer, ob du die Informationen nicht auch in einer einfachen Liste unterbringen kannst (siehe Textgestaltung).
Grundlagen
Jede Tabelle im Wiki-Stil 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. (Aussnahme: Tabellen im Schreibmaschinenstil)
Einfache Tabellen
Tabellen im Schreibmaschinenstil ohne Formatierungen
Die einfachste und schnellste Art, eine Tabelle zu erstellen ist der Schreibmaschinenstil. Dazu stellt man jeder Tabellenzeile ein Leerzeichen voran. Spalten und Layout werden visuell im Bearbeitungsmodus angepasst. Das Ergebnis entspricht anschließend genau der Ansicht im Bearbeitungsmodus.
Beispiel:
Klimatabelle Monat JAN FEB MÄR APR MAI JUN JUL AUG SEP OKT NOV DEZ ----------------------------------------------------------------------- Ø Tagestemperatur 21 21 22 23 24 25 27 29 28 26 24 22 Ø Nachttemperatur 15 15 15 16 17 18 20 21 20 19 18 16 Ø Sonnenstunden pro Tag 6 6 7 8 9 9 9 9 8 7 6 5 Ø Regentage/Monat 6 4 3 2 2 1 0 0 2 5 6 7 Ø Wassertemperatur 19 18 18 18 19 20 21 22 23 23 21 20
Tabelle mit einer Tabellenzeile
Jede Zeile innerhalb der beiden Klammern beginnt mit einem senkrechten Strich. Dieser macht den Beginn einer neuen Zelle deutlich. Direkt hinter diesem Strich steht entweder der Inhalt der Zelle oder eine Style-Argument (z.B. Rowspanning - siehe unten). Der Strich kann am Anfang der Textzeile stehen oder auch mittendrin, dann muss man zwei Striche schreiben. Jedoch sollte man ihn nur am Anfang einer Textzeile verwenden um die Tabellenstruktur übersichtlich zu halten.
Beispiele
Die einfachste Tabelle (sie beinhaltet nur eine Zelle) sieht im Text so aus:
{| |Minimaltabelle im Schreibmaschinenstil |}
Und stellt sich so dar:
Minimaltabelle |
Eine Tabelle mit zwei Zellen in einer Tabellenzeile sieht im Text so aus:
{| |Zelle 1 |Zelle 2 |}
Und stellt sich so dar:
Zelle 1 | Zelle 2 |
Tabelle mit mehreren Tabellenzeilen
Natürlich benötigt man hauptsächlich Tabellen mit mehreren (Tabellen-)Zeilen. Eine neue Zeile wird deutlich gemacht, indem hinter dem senkrechten Strich einen waagrechten - setzt. Dies läßt sich beliebig oft wiederholen.
Beispiele
Eine Tabelle mit zwei Tabellenzeilen mit je zwei Zellen sieht im Text so aus:
{| |Zelle 1 |Zelle 2 |- |Zelle 3 |Zelle 4 |}
Und stellt sich so dar:
Zelle 1 | Zelle 2 |
Zelle 3 | Zelle 4 |
Eine mit drei Tabellenzeilen sieht im Text so aus:
{| |Zelle 1 |Zelle 2 |- |Zelle 3 |Zelle 4 |- |Zelle 5 |Zelle 6 |}
Und stellt sich so dar:
Zelle 1 | Zelle 2 |
Zelle 3 | Zelle 4 |
Zelle 5 | Zelle 6 |
und so weiter.
Komplexere Tabellen
Rahmen
Bis jetzt haben unsere Tabellen noch keine Umrandungen. Die Umrandung wird in der ersten Zeile (direkt hinter dem {| ) festgelegt, dabei ist zu beachten, eine Leerstelle zu lassen. Momentan kann nur die Rahmenstärke festgelegt werden, mit dem Argument: border=n wobei n die Stärke des Rahmens ist.
Beispiel
Das letzte Beispiel von oben sieht mit Rahmen im Text so aus:
{| border=1 |Zelle 1 |Zelle 2 |- |Zelle 3 |Zelle 4 |- |Zelle 5 |Zelle 6 |}
und stellt sich so dar:
Zelle 1 | Zelle 2 |
Zelle 3 | Zelle 4 |
Zelle 5 | Zelle 6 |
Rowspanning und Colspanning
Auch mit den neuen Wiki-Befehlen ist es genauso wie bei HTML möglich eine Zelle über mehere Zeilen reichen zu lassen, ein so genanntes rowspan. Um rowspan einzuschalten muss man vor der betreffenden Zelle, aber unbedingt in der gleichen Zeile, das rowspan-Argument einfügen, etwa in der Form rowspan=n wobei n für die Anzahl der Zeilen steht, über die die Zelle reichen soll. Soll eine Zelle über mehrere Spalten reichen benutze man colspan.
Beispiel
Eine Tabelle, in der Zelle 2 über zwei Spalten reicht, sieht im Text so aus:
{| border=1 |Zelle 1 |rowspan=2 | Zelle 2, mit rowspan |Zelle 3 |- |Zelle 4 |Zelle 5 |}
und stellt sich so dar:
Zelle 1 | Zelle 2, mit rowspan | Zelle 3 |
Zelle 4 | Zelle 5 |
Verschachtelte Tabellen
Das Verschachteln ist mit den neuen Wiki-Befehlen denkbar einfach. Man muss nur an der Stelle, an der man eine weitere Tabelle, innerhalb einer anderen Tabelle wünscht, eine neue öffnende Klammer setzen. Wichtig ist es nur, dass dort am Anfang der Textzeile ausnahmsweise kein senkrechter Strich stehen darf!
Beispiel
Eine Tabelle, in der eine weitere Tabelle steckt, sieht im Text so aus:
{| border=1 |Zelle 1 | {| border=2 |Zelle A |- |Zelle B |} |Zelle 3 |}
und stellt sich so dar:
Zelle 1 |
|
Zelle 3 |
Beschriftung
Mit den neuen Wiki-Befehlen ist es leicht möglich, eine Beschriftung über der Tabelle zu implementieren. Diese Beschriftung ist zentriert und maximal genauso breit wie die Tabelle mit automatischen Zeilenumbruch. Um eine Beschriftung einzubauen reicht es nach dem senkrechten Strich und vor dem Text ein Plus + zu setzen. Innerhalb der Beschriftung kann man ganz normal mit Wiki-Befehlen formatieren.
Beispiel
Eine Tabelle, mit Beschriftung, sieht im Text so aus:
{||border=1 |+ Dies ist eine '''Beschriftung''', die ''ziemlich'' lang ist. |Zelle 1 |Zelle 2 |- |Zelle 3 |Zelle 4 |}
und stellt sich so dar:
Zelle 1 | Zelle 2 |
Zelle 3 | Zelle 4 |
Bilder und Tabellen
Bilder in Tabellen zu formatieren ist möglich mit dem class-Argument "rimage". Class-Argumente können am Anfang einer Tabelle stehen und gelten dann für die ganze Tabelle (ähnlich wie Rahmen (siehe oben)) oder am Anfang einer Zelle. Das Interessante ist, dass nicht nur das Bild formatiert wird, sondern auch der zugehörige Text, dies ist zum Beispiel nützlich für Bildunterschriften. Das class-Argument wir mittels class=rimage eingebunden. Dadurch wird die Größe der Zelle auf das Bild ausgedehnt, ein kleiner Abstand um das Bild zum Rahmen wird beibehalten, und der Text verkleinert und zentriert und das ganze auf die rechte Seite geschoben.
Um ein Bild mit einer Bildunterschrift anzuzeigen, verwendet man die folgende Struktur.
{| class=rimage | Bild:Ardapedia-bilder_beispiel_drache.jpg Ein langer Text, der unter dem Bild steht. |}
Das Ergebnis im Text ist:
Datei:Ardapedia-bilder beispiel drache.jpg Ein langer Text, der unter dem Bild steht. |
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas augue. Quisque dapibus, est sed mattis mollis, orci tortor pretium lorem, id feugiat leo tellus eget nibh. Phasellus vel dui. Aliquam sollicitudin ante et dolor. Fusce dictum eros vitae dolor. Aliquam erat volutpat. Etiam pede orci, aliquam sed, mattis quis, bibendum et, metus. Aenean libero. Aliquam erat volutpat. Vestibulum placerat risus quis lacus. Mauris ultrices venenatis est. Etiam accumsan euismod lorem. Ut sollicitudin mi at massa. Morbi aliquam wisi non justo. Suspendisse consectetuer dui vitae wisi. Nulla sed lectus sed lorem rhoncus fringilla. Aenean leo orci, ultrices et, ornare eu, imperdiet non, nunc. Praesent sed purus at quam convallis vehicula.
Sed pede wisi, eleifend vel, lobortis quis, molestie vitae, nisl. Quisque eget urna quis tellus dictum egestas. Nulla facilisi. Aliquam fermentum dapibus enim. Morbi in tellus vitae lacus ultrices volutpat. Aenean tortor ante, consectetuer eget, laoreet lobortis, lobortis id, metus. Fusce id enim. Aliquam erat volutpat. Quisque venenatis erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas vulputate diam in sapien.
Beispiele
Um ein Bild mit einer Bildunterschrift anzuzeigen, verwendet man die folgende Struktur.
{| class=rimage | http://elvelynn.de/Avatar/gollum_5_ttt.jpg Ein langer Text, der unter dem Bild steht. |}
Das Ergebnis im Text ist:
http://elvelynn.de/Avatar/gollum_5_ttt.jpg Ein langer Text, der unter dem Bild steht. |
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas augue. Quisque dapibus, est sed mattis mollis, orci tortor pretium lorem, id feugiat leo tellus eget nibh. Phasellus vel dui. Aliquam sollicitudin ante et dolor. Fusce dictum eros vitae dolor. Aliquam erat volutpat. Etiam pede orci, aliquam sed, mattis quis, bibendum et, metus. Aenean libero. Aliquam erat volutpat. Vestibulum placerat risus quis lacus. Mauris ultrices venenatis est. Etiam accumsan euismod lorem. Ut sollicitudin mi at massa. Morbi aliquam wisi non justo. Suspendisse consectetuer dui vitae wisi. Nulla sed lectus sed lorem rhoncus fringilla. Aenean leo orci, ultrices et, ornare eu, imperdiet non, nunc. Praesent sed purus at quam convallis vehicula.
Sed pede wisi, eleifend vel, lobortis quis, molestie vitae, nisl. Quisque eget urna quis tellus dictum egestas. Nulla facilisi. Aliquam fermentum dapibus enim. Morbi in tellus vitae lacus ultrices volutpat. Aenean tortor ante, consectetuer eget, laoreet lobortis, lobortis id, metus. Fusce id enim. Aliquam erat volutpat. Quisque venenatis erat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas vulputate diam in sapien.
Die folgende Funktion funktioniert noch nicht in der deutschen Wikipedia: Eine Tabelle, mit Flagge mit Bildunterschrift,(flag) sieht im Text so aus:
{| class=flag | http://elvelynn.de/Avatar/sam_3_fotr.jpg Ein kurzer Text |}
und stellt sich so dar:
http://elvelynn.de/Avatar/sam_3_fotr.jpg Ein kurzer Text |