Hilfe:Tabellen: Unterschied zwischen den Versionen

aus Kamelopedia, der wüsten Enzyklopädie
Zur Navigation springen Zur Suche springen
(prettytable)
K (überarbeitet)
Zeile 1: Zeile 1:
 
{{Hilfenavi}}
 
{{Hilfenavi}}
Eine ganz einfache Tabelle geht so:
+
 
<div style="font-family:monospace">
+
==Grundlagen==
<nowiki>{| border="1" cellpadding="5px"</nowiki><br/>
+
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 '''}'''.
<nowiki>|erste Zeile, erste Spalte || erste Zeile, zweite Spalte</nowiki><br/>
+
 
 +
{|
 +
|<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{|</nowiki>
 +
 
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|}
 +
 
 +
 
 +
==Einfache Tabellen==
 +
 
 +
Jede Zeile innerhalb der beiden Klammern beginnt mit einem senkrechten Strich '''|'''. Dieser macht den Beginn einer neuen Zelle deutlich. Danach kommt der Inhalt der Zelle.
 +
 
 +
Eine Tabelle mit zwei Zellen in einer Tabellenzeile sieht im Text so aus:
 +
 
 +
{|
 +
|<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{|</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{|
 +
|Zelle 1
 +
|Zelle 2
 +
|}
 +
|}
 +
 
 +
===Alternative Schreibweise===
 +
Zum Platzsparen ist es möglich, mehrere Tabellenzellen in einer Quelltextzeile unterzubringen; in diesem Fall muss man die Zellen mit '''||''' trennen:
 +
 
 +
{|
 +
|<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{|</nowiki><br/>
 +
<nowiki>|Zelle 1||Zelle 2</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{|
 +
|Zelle 1||Zelle 2
 +
|}
 +
|}
 +
 
 +
===Tabelle mit mehreren Tabellenzeilen===
 +
Der Beginn einer neuen Zeile wird deutlich gemacht, indem man hinter dem senkrechten Strich '''|''' einen waagerechten '''–''' setzt.
 +
 
 +
{|
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{|</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 
<nowiki>|-</nowiki><br/>
 
<nowiki>|-</nowiki><br/>
<nowiki>|zweite Zeile, erste Spalte || zweite Zeile, zweite Spalte</nowiki><br/>
+
<nowiki>|Zelle 3</nowiki><br/>
<nowiki>|}<br/></nowiki>
+
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|}</nowiki>
 
</div>
 
</div>
 +
|
 +
{|
 +
|Zelle 1
 +
|Zelle 2
 +
|-
 +
|Zelle 3
 +
|Zelle 4
 +
|}
 +
|}
  
und die schaut dann so aus:
+
 
{| border="1" cellpadding="5px"
+
==Komplexere Tabellen==
|erste Zeile, erste Spalte || erste Zeile, zweite Spalte
+
===Rahmen===
 +
Einen Rahmen erhält man, wenn mit '''border="x"''', wobei '''x''' die Stärke des Rahmens festlegt.
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1"</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 3</nowiki><br/>
 +
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 5</nowiki><br/>
 +
<nowiki>|Zelle 6</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1"
 +
|Zelle 1
 +
|Zelle 2
 
|-
 
|-
|zweite Zeile, erste Spalte || zweite Zeile, zweite Spalte
+
|Zelle 3
 +
|Zelle 4
 +
|-
 +
|Zelle 5
 +
|Zelle 6
 +
|}
 
|}
 
|}
  
 +
oder
 +
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="5"</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|Zelle 3</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|Zelle 5</nowiki><br/>
 +
<nowiki>|Zelle 6</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="5"
 +
|Zelle 1
 +
|Zelle 2
 +
|Zelle 3
 +
|-
 +
|Zelle 4
 +
|Zelle 5
 +
|Zelle 6
 +
|}
 +
|}
  
Beginnt man stattdessen mit
+
===<nowiki>{{prettytable}}</nowiki>===
<div style="font-family:monospace">
+
'''<nowiki>{{prettytable}}</nowiki>''' ist eine Vorlage, die ein vorformatiertes Design enthält.
 +
 
 +
{|
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 
<nowiki>{| {{prettytable}}</nowiki><br/>
 
<nowiki>{| {{prettytable}}</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|Zelle 3</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|Zelle 5</nowiki><br/>
 +
<nowiki>|Zelle 6</nowiki><br/>
 +
<nowiki>|}</nowiki>
 
</div>
 
</div>
 +
|
 +
{| {{prettytable}}
 +
|Zelle 1
 +
|Zelle 2
 +
|Zelle 3
 +
|-
 +
|Zelle 4
 +
|Zelle 5
 +
|Zelle 6
 +
|}
 +
|}
  
dann sieht es so aus:
+
=== Titelzeilen ===
{| {{prettytable}}
+
Eine Tabelle mit Titelzeile erreicht man, indem die Zellen, die hervorgehoben werden sollen, mit '''!''' statt '''|''' eingeleitet werden:
|erste Zeile, erste Spalte || erste Zeile, zweite Spalte
+
 
 +
{|
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1"</nowiki><br/>
 +
<nowiki>!Lama</nowiki><br/>
 +
<nowiki>!Dromedar</nowiki><br/>
 +
<nowiki>!Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 1</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|Zelle 3</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|Zelle 5</nowiki><br/>
 +
<nowiki>|Zelle 6</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1"
 +
!Lama
 +
!Dromedar
 +
!Kamel
 +
|-
 +
|Zelle 1
 +
|Zelle 2
 +
|Zelle 3
 +
|-
 +
|Zelle 4
 +
|Zelle 5
 +
|Zelle 6
 +
|}
 +
|}
 +
 
 +
===Zelle über mehrere Spalten===
 +
Mit '''colspan="x"''' kann man Zellen über mehrere Spalten reichen lassen, wobei '''x''' die Anzahl der Spalten festlegt, über die sich die Zelle erstreckt.
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1"</nowiki><br/>
 +
<nowiki>| colspan="3" |Zelle 1</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 2</nowiki><br/>
 +
<nowiki>|Zelle 3</nowiki><br/>
 +
<nowiki>|Zelle 4</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|Zelle 5</nowiki><br/>
 +
<nowiki>|Zelle 6</nowiki><br/>
 +
<nowiki>|Zelle 7</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1"
 +
| colspan="3"|Zelle 1
 +
|-
 +
|Zelle 2
 +
|Zelle 3
 +
|Zelle 4
 +
|-
 +
|Zelle 5
 +
|Zelle 6
 +
|Zelle 7
 +
|}
 +
|}
 +
 
 +
==Formatierungen==
 +
===Spaltenbreiten===
 +
Spaltenbreiten können mit '''width="x%"''' festgelegt (relative Angabe). Absolute Angaben in Pixeln sind eher bei Grafiken sinnvoll. [[Hilfe:Tabellen#Titelzeilen|Titelzeilen]] werden automatisch zentriert.
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1"</nowiki><br/>
 +
<nowiki>! width="10%" |Lama</nowiki><br/>
 +
<nowiki>! width="20%" |Dromedar</nowiki><br/>
 +
<nowiki>! width="40%" |Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|10%</nowiki><br/>
 +
<nowiki>|20%</nowiki><br/>
 +
<nowiki>|40%</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1"
 +
! width="10%" |Lama
 +
! width="20%" |Dromedar
 +
! width="40%" |Kamel
 +
|-
 +
|10%
 +
|20%
 +
|40%
 +
|}
 +
|}
 +
 
 +
===Ausrichtung===
 +
Um die Inhalte der anderen Zellen auszurichten, benutzt man '''align="x"''', wobei '''left''' (links), '''center''' (mittig) oder '''right''' (rechts) für '''x''' eingesetzt werden kann. 
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1"</nowiki><br/>
 +
<nowiki>! width="10%" |Lama</nowiki><br/>
 +
<nowiki>! width="20%" |Dromedar</nowiki><br/>
 +
<nowiki>! width="40%" |Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|align="left" |10%</nowiki><br/>
 +
<nowiki>|align="center" |20%</nowiki><br/>
 +
<nowiki>|align="right" |40%</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1"
 +
! width="10%" |Lama
 +
! width="20%" |Dromedar
 +
! width="40%" |Kamel
 +
|-
 +
|align="left" |10%
 +
|align="center" |20%
 +
|align="right" |40%
 +
|}
 +
|}
 +
 
 +
===Zellenabstände===
 +
Mit '''cellspacing="x"''' kann der Abstand zwischen den Zellen festgelegt werden. Je größer das '''x''', desto breiter wird der Steg zwischen den Zellen. Mit '''cellpadding="x"''' bestimmt man den Abstand des Zellinhaltes vom Zellrahmen.
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1" cellspacing="10"</nowiki><br/>
 +
<nowiki>! width="10%" |Lama</nowiki><br/>
 +
<nowiki>! width="20%" |Dromedar</nowiki><br/>
 +
<nowiki>! width="40%" |Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|align="center" |10%</nowiki><br/>
 +
<nowiki>|align="center" |20%</nowiki><br/>
 +
<nowiki>|align="center" |40%</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1" cellspacing="10"
 +
! width="10%" |Lama
 +
! width="20%" |Dromedar
 +
! width="40%" |Kamel
 +
|-
 +
|align="center" |10%
 +
|align="center" |20%
 +
|align="center" |40%
 +
|}
 +
|}
 +
 
 +
bzw:
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1" cellpadding="10"</nowiki><br/>
 +
<nowiki>! width="10%" |Lama</nowiki><br/>
 +
<nowiki>! width="20%" |Dromedar</nowiki><br/>
 +
<nowiki>! width="40%" |Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|align="center" |10%</nowiki><br/>
 +
<nowiki>|align="center" |20%</nowiki><br/>
 +
<nowiki>|align="center" |40%</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1" cellpadding="10"
 +
! width="10%" |Lama
 +
! width="20%" |Dromedar
 +
! width="40%" |Kamel
 +
|-
 +
|align="center" |10%
 +
|align="center" |20%
 +
|align="center" |40%
 +
|}
 +
|}
 +
 
 +
oder zusammen:
 +
 
 +
{| 
 +
|
 +
<div style="background:#f7f8ff;border:1px solid #8888aa;border-collapse:collapse;margin:10px 0;padding:5px;font-family:monospace;font-size:95%;">
 +
<nowiki>{| border="1" cellpadding="10" cellspacing="10"</nowiki><br/>
 +
<nowiki>! width="10%" |Lama</nowiki><br/>
 +
<nowiki>! width="20%" |Dromedar</nowiki><br/>
 +
<nowiki>! width="40%" |Kamel</nowiki><br/>
 +
<nowiki>|-</nowiki><br/>
 +
<nowiki>|align="center" |10%</nowiki><br/>
 +
<nowiki>|align="center" |20%</nowiki><br/>
 +
<nowiki>|align="center" |40%</nowiki><br/>
 +
<nowiki>|}</nowiki>
 +
</div>
 +
|
 +
{| border="1" cellpadding="10" cellspacing="10"
 +
! width="10%" |Lama
 +
! width="20%" |Dromedar
 +
! width="40%" |Kamel
 
|-
 
|-
|zweite Zeile, erste Spalte || zweite Zeile, zweite Spalte
+
|align="center" |10%
 +
|align="center" |20%
 +
|align="center" |40%
 +
|}
 
|}
 
|}
{{sa}} [http://de.wikipedia.org/wiki/Wikipedia:Tabellen Wikipedia:Tabellen]
 
  
 +
__NOEDITSECTION__
 +
{{WPTitel|Hilfe:Tabellen}}
  
 
[[Kategorie:Kamelopedia Hilfe]]
 
[[Kategorie:Kamelopedia Hilfe]]

Version vom 3. September 2006, 04:55 Uhr


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 }.

{|

|}


Einfache Tabellen

Jede Zeile innerhalb der beiden Klammern beginnt mit einem senkrechten Strich |. Dieser macht den Beginn einer neuen Zelle deutlich. Danach kommt der Inhalt der Zelle.

Eine Tabelle mit zwei Zellen in einer Tabellenzeile sieht im Text so aus:

{|
|Zelle 1
|Zelle 2
|}

Zelle 1 Zelle 2

Alternative Schreibweise

Zum Platzsparen ist es möglich, mehrere Tabellenzellen in einer Quelltextzeile unterzubringen; in diesem Fall muss man die Zellen mit || trennen:

{|
|Zelle 1||Zelle 2
|}

Zelle 1 Zelle 2

Tabelle mit mehreren Tabellenzeilen

Der Beginn einer neuen Zeile wird deutlich gemacht, indem man hinter dem senkrechten Strich | einen waagerechten setzt.

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

Zelle 1 Zelle 2
Zelle 3 Zelle 4


Komplexere Tabellen

Rahmen

Einen Rahmen erhält man, wenn mit border="x", wobei x die Stärke des Rahmens festlegt.

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

Zelle 1 Zelle 2
Zelle 3 Zelle 4
Zelle 5 Zelle 6

oder

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

Zelle 1 Zelle 2 Zelle 3
Zelle 4 Zelle 5 Zelle 6

{{prettytable}}

{{prettytable}} ist eine Vorlage, die ein vorformatiertes Design enthält.

{| {{prettytable}}
|Zelle 1
|Zelle 2
|Zelle 3
|-
|Zelle 4
|Zelle 5
|Zelle 6
|}

Zelle 1 Zelle 2 Zelle 3
Zelle 4 Zelle 5 Zelle 6

Titelzeilen

Eine Tabelle mit Titelzeile erreicht man, indem die Zellen, die hervorgehoben werden sollen, mit ! statt | eingeleitet werden:

{| border="1"
!Lama
!Dromedar
!Kamel
|-
|Zelle 1
|Zelle 2
|Zelle 3
|-
|Zelle 4
|Zelle 5
|Zelle 6
|}

Lama Dromedar Kamel
Zelle 1 Zelle 2 Zelle 3
Zelle 4 Zelle 5 Zelle 6

Zelle über mehrere Spalten

Mit colspan="x" kann man Zellen über mehrere Spalten reichen lassen, wobei x die Anzahl der Spalten festlegt, über die sich die Zelle erstreckt.

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

Zelle 1
Zelle 2 Zelle 3 Zelle 4
Zelle 5 Zelle 6 Zelle 7

Formatierungen

Spaltenbreiten

Spaltenbreiten können mit width="x%" festgelegt (relative Angabe). Absolute Angaben in Pixeln sind eher bei Grafiken sinnvoll. Titelzeilen werden automatisch zentriert.

{| border="1"
! width="10%" |Lama
! width="20%" |Dromedar
! width="40%" |Kamel
|-
|10%
|20%
|40%
|}

Lama Dromedar Kamel
10% 20% 40%

Ausrichtung

Um die Inhalte der anderen Zellen auszurichten, benutzt man align="x", wobei left (links), center (mittig) oder right (rechts) für x eingesetzt werden kann.

{| border="1"
! width="10%" |Lama
! width="20%" |Dromedar
! width="40%" |Kamel
|-
|align="left" |10%
|align="center" |20%
|align="right" |40%
|}

Lama Dromedar Kamel
10% 20% 40%

Zellenabstände

Mit cellspacing="x" kann der Abstand zwischen den Zellen festgelegt werden. Je größer das x, desto breiter wird der Steg zwischen den Zellen. Mit cellpadding="x" bestimmt man den Abstand des Zellinhaltes vom Zellrahmen.

{| border="1" cellspacing="10"
! width="10%" |Lama
! width="20%" |Dromedar
! width="40%" |Kamel
|-
|align="center" |10%
|align="center" |20%
|align="center" |40%
|}

Lama Dromedar Kamel
10% 20% 40%

bzw:

{| border="1" cellpadding="10"
! width="10%" |Lama
! width="20%" |Dromedar
! width="40%" |Kamel
|-
|align="center" |10%
|align="center" |20%
|align="center" |40%
|}

Lama Dromedar Kamel
10% 20% 40%

oder zusammen:

{| border="1" cellpadding="10" cellspacing="10"
! width="10%" |Lama
! width="20%" |Dromedar
! width="40%" |Kamel
|-
|align="center" |10%
|align="center" |20%
|align="center" |40%
|}

Lama Dromedar Kamel
10% 20% 40%


Basiert auf Hilfe:Tabellen aus der Wikipedia; Lizenz: CC-by-SA, GFDL; Autorenliste.