Hilfe:Tabellen: Unterschied zwischen den Versionen

Aus InkluPedia
(+kategorie)
(+)
Zeile 83: Zeile 83:
<div style="float:left; margin-right:2em;">
<div style="float:left; margin-right:2em;">
<pre style="white-space: pre nowrap">
<pre style="white-space: pre nowrap">
{|
{| class="wikitable"
  ! colspan="3"| Obst
  ! colspan="3"| Obst
  |-
  |-
Zeile 93: Zeile 93:
<div style="float:left; margin-right:2em;">
<div style="float:left; margin-right:2em;">
<pre style="white-space: pre nowrap">
<pre style="white-space: pre nowrap">
{|
{| class="wikitable"
  ! rowspan="4"| Obst:
  ! rowspan="4"| Obst:
  |-
  |-
Zeile 103: Zeile 103:
|}
|}
</pre>
</pre>
</div>
<div style="clear:left;"></div>
ergibt:
<div style="float:left; margin-right:9.2em;">
{| class="wikitable"
! colspan="3"| Obst
|-
| Apfel || Birne || Zitrone
|}
</div>
<div style="float:left; margin-right:2em;">
{| class="wikitable"
! rowspan="4"| Obst:
|-
| Apfel
|-
| Birne
|-
| Zitrone
|}
</div>
</div>


<div style="clear:left;"></div>
<div style="clear:left;"></div>


Mit <code>class="prettytable sortable"</code> ist eine sortierbare Tabelle möglich. Mit <code>align="left"</code> (Standard), <code>align="center"</code> oder <code>align="right"</code> kann der Text in der Tabellenzelle positioniert werden.
Mit <code>class="prettytable sortable"</code> ist eine sortierbare Tabelle möglich. Mit <code>align="left"</code> (Standard), <code>align="center"</code> oder <code>align="right"</code> kann der Text in der Tabellenzelle positioniert werden.


<div style="float:left;">
<pre style="white-space: pre nowrap">
{| class="prettytable sortable"
|- align="center"
  ! Obst
  ! Eigenschaft
  ! Menge
|- align="left"
  | Birne
  | Klein
  | 5
|- align="center"
  | Apfel
  | Groß
  | 3
|- align="right"
  | Orange
  | Klein
  | 8
|}
</pre>
</div>
<div style="clear:left;"></div>
ergibt:
{| class="prettytable sortable"  
{| class="prettytable sortable"  
  |- align="center"
  |- align="center"
Zeile 127: Zeile 174:
   | 8
   | 8
|}
|}


Mit <code>class="wikitable sortable"</code> ist eine sortierbare Tabelle inklusive Zellenrahmen möglich:
Mit <code>class="wikitable sortable"</code> ist eine sortierbare Tabelle inklusive Zellenrahmen möglich:


<div style="float:left;">
<pre style="white-space: pre nowrap">
{| class="wikitable sortable"  
{| class="wikitable sortable"  
  |- align="center"
  |- align="center"
Zeile 141: Zeile 191:
   | Groß
   | Groß
|}
|}
</pre>
</div>
<div style="clear:left;"></div>
ergibt:
{| class="wikitable sortable"
|- align="center"
  ! Überschrift 1
  ! Überschrift 2
|- align="center"
  | Birne
  | Klein
|- align="center"
  | Apfel
  | Groß
|}


== Tabellenhintergrundfarben ==
== Tabellenhintergrundfarben ==

Version vom 19. März 2021, 22:35 Uhr

Einfache Tabellen

Einfache transparente Tabellen lassen sich wie in folgenden Beispielen erstellen. In der MediaWiki-Syntax beginnt jede Tabelle mit einer offenen geschweiften Klammer { gefolgt von einem senkrechten Strich (Pipe-Zeichen) | und endet mit einem Strich | gefolgt von einer geschlossenen geschweiften Klammer }.

Quelltext:

Zwei Zeilen

{|
 |-
 | Zelle 1
 |-
 | Zelle 2
|}

Zwei Spalten

{|
 |-
 | Zelle 1
 | Zelle 2
|}

Zwei Spalten alternativ

{|
 |-
 | Zelle 1 || Zelle 2
|}

Zwei Zeilen und zwei Spalten

{|
 |-
 | Zelle 1/1
 | Zelle 2/1
 |-
 | Zelle 1/2
 | Zelle 2/2
|}

Zwei Spalten mit Spaltenüberschrift

{|
 ! Überschrift 1 !! Überschrift 2
 |-
 | Zelle 1 || Zelle 2
|}

Zwei Spalten mit Spaltenüberschrift und Tabellenüberschrift

{|
 |+Tabellenüberschrift
 |-
 | Zelle 1
 |-
 | Zelle 2
|}



Tabellenzellen können mit colspan (für column span) über mehrere Spalten und mit rowspan (für row span) über mehrere Zeilen verbunden werden.

Quelltext:

{| class="wikitable"
 ! colspan="3"| Obst
 |-
 | Apfel || Birne || Zitrone
|}
{| class="wikitable"
 ! rowspan="4"| Obst:
 |-
 | Apfel
 |-
 | Birne
 |-
 | Zitrone
|}

ergibt:

Obst
Apfel Birne Zitrone
Obst:
Apfel
Birne
Zitrone


Mit class="prettytable sortable" ist eine sortierbare Tabelle möglich. Mit align="left" (Standard), align="center" oder align="right" kann der Text in der Tabellenzelle positioniert werden.

{| class="prettytable sortable" 
 |- align="center"
  ! Obst
  ! Eigenschaft
  ! Menge
 |- align="left"
  | Birne
  | Klein
  | 5
 |- align="center"
  | Apfel
  | Groß
  | 3
 |- align="right"
  | Orange
  | Klein
  | 8
|}

ergibt:

Obst Eigenschaft Menge
Birne Klein 5
Apfel Groß 3
Orange Klein 8


Mit class="wikitable sortable" ist eine sortierbare Tabelle inklusive Zellenrahmen möglich:

{| class="wikitable sortable" 
 |- align="center"
  ! Überschrift 1
  ! Überschrift 2
 |- align="center"
  | Birne
  | Klein
 |- align="center"
  | Apfel
  | Groß
|}

ergibt:

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß


Tabellenhintergrundfarben

Mit class="wikitable" sind folgende Tabellenhintergrundfarben möglich. Diese sind in https://inklupedia.de/wiki/MediaWiki:Common.css definiert:

Hintergrundfarbe Hex-Wert
hintergrundfarbe1 (Standard) #f8f9fa
hintergrundfarbe2 #fff
hintergrundfarbe3 #ffff40
hintergrundfarbe4 #fa0
hintergrundfarbe5 #eaecf0
hintergrundfarbe6 #b3b7ff
hintergrundfarbe7 #ffcbcb
hintergrundfarbe8 #ffebad
hintergrundfarbe9 #b9ffc5


Mit class="zebra wikitable" wird eine abwechselnde Tabellenhintergrundfarbe generiert. Zebra ist in https://inklupedia.de/wiki/MediaWiki:Common.css definiert:

Überschrift
Zeile 1, Hintergrundfarbe weiß
Zeile 2, Hintergrundfarbe grau
Zeile 3, Hintergrundfarbe weiß
Zeile 4, Hintergrundfarbe grau
Zeile 5, Hintergrundfarbe weiß


Mit bgcolor="#nnnnnn" (Beispielsweise bgcolor="#0099ff" für tiefes blau, bgcolor="#f8f8ff" für helles blau und bgcolor="ff0000" für rot) wird die Hintergrundfarbe mit dem Hexadezimalwert der Farbe abweichend vom Standard festgelegt. Farbtabellen und ggf. Umrechner gibt es zum Beispiel unter https://www.farbtabelle.at/ , https://html-color-codes.info/webfarben_hexcodes/ und http://www.rechnr.de/farbenrechner

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß


Einklappbare/ausklappbare Tabellen

Mit class="mw-collapsible" ist eine einklappbare Tabelle möglich:

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß


Mit class="mw-collapsible mw-collapsed" ist eine aufklappbare Tabelle möglich:

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß


Mit class="mw-collapsible sortable" ist eine einklappbare sortierbare Tabelle möglich:

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß


Mit class="mw-collapsible mw-collapsed sortable wikitable" ist eine ausklappbare sortierbare Tabelle im wikitable Style möglich:

Überschrift 1 Überschrift 2
Birne Klein
Apfel Groß

Werkzeuge

Mit dem Tool "Copy & Paste Excel-to-Wiki Converter" besteht die Möglichkeit, eine Tabelle aus einer beliebigen Tabellenkalkulation (mit LibreOffice Calc getestet) per copy & paste in "Wikicode" per Knopfdruck umzuwandeln. Die Spalten sind dann aber noch nicht sortierbar und müssen bei Bedarf noch entsprechend angepasst werden. Das Tool steht unter https://excel2wiki.toolforge.org/ auch als PHP-Script für die Offlinenutzung zur Verfügung. Unter https://tools.wmflabs.org/excel2wiki/ und http://www.hifi-remote.com/excel2wiki/index.php gibt es Online-Versionen des Tools. Alternativ steht mit tab2wiki unter https://tools.wmflabs.org/magnustools/tab2wiki.php ein weiteres PHP-Script für die Onlinenutzung zur Verfügung.

Mit dem Onlinegenerator unter https://www.tablesgenerator.com/mediawiki_tables können Tabellen direkt online im Browser erstellt werden. Der Generator unterstützt verbundene Zellen.