Benutzer-Werkzeuge

Webseiten-Werkzeuge


users:werner:exttab1_en

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

users:werner:exttab1_en [2006-10-20 0744]
werner
users:werner:exttab1_en [2006-12-02 1547] (aktuell)
werner to show the code...
Zeile 1: Zeile 1:
 +====== Extended Table Syntax ======
  
 +===== Ex. 0: extended =====
 + 
 +including some of [[doku>​wiki:​dokuwiki|DokuWiki]]'​s Syntax
 +
 +The "​zero"​ Example from Eric-Sebastien (from page [[doku>​users:​wflamme:​exttab1]]:​
 +
 +<​exttab1>​
 +{| width=80% align=center
 +|align=center|[[wiki:​page|{{wiki:​dokuwiki-128.png}}]]
 +|}
 +</​exttab1>​
 +
 +  {| width=80% align=center
 +  |align=center|[[wiki:​page|{{wiki:​dokuwiki-128.png}}]]
 +  |}
 +
 +----
 +
 +The other examples are taken from [[http://​www.mediawiki.org/​wiki/​Help:​Tables]]
 +
 +===== Ex. 1: Plain =====
 +
 +<​exttab1>​
 +{|
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {|
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +===== Ex. 2: Alternative =====
 +
 +<​exttab1>​
 +{|
 +|  Orange ​   ||   ​Apple ​  ​|| ​  more
 +|-
 +|   ​Bread ​   ||   ​Pie ​    ​|| ​  more
 +|-
 +|   ​Butter ​  || Ice cream ||  and more
 +|}
 +</​exttab1>​
 +
 +  {|
 +  |  Orange ​   ||   ​Apple ​  ​|| ​  more
 +  |-
 +  |   ​Bread ​   ||   ​Pie ​    ​|| ​  more
 +  |-
 +  |   ​Butter ​  || Ice cream ||  and more
 +  |}
 +
 +----
 +
 +===== with HTML attributes =====
 +
 +==== Ex. 3 ====
 +
 +<​exttab1>​
 +{| border="​1"​
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 4 ====
 +
 +<​exttab1>​
 +{| align="​center"​ border="​1"​
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| align="​center"​ border="​1"​
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 5 ====
 +
 +<​exttab1>​
 +{| border="​1"​
 +|Orange
 +|Apple
 +|align="​right"​|12,​333.00
 +|-
 +|Bread
 +|Pie
 +|align="​right"​|500.00
 +|-
 +|Butter
 +|Ice cream
 +|align="​right"​|1.00
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​
 +  |Orange
 +  |Apple
 +  |align="​right"​|12,​333.00
 +  |-
 +  |Bread
 +  |Pie
 +  |align="​right"​|500.00
 +  |-
 +  |Butter
 +  |Ice cream
 +  |align="​right"​|1.00
 +  |}
 +
 +----
 +
 +==== Ex. 6 ====
 +
 +for single lines
 +
 +<​exttab1>​
 +{| border="​1"​
 +|Orange
 +|Apple
 +|align="​right"​|12,​333.00
 +|-
 +|Bread
 +|Pie
 +|align="​right"​|500.00
 +|- style="​font-style:​italic;​color:​green;"​
 +|Butter
 +|Ice cream
 +|align="​right"​|1.00
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​
 +  |Orange
 +  |Apple
 +  |align="​right"​|12,​333.00
 +  |-
 +  |Bread
 +  |Pie
 +  |align="​right"​|500.00
 +  |- style="​font-style:​italic;​color:​green;"​
 +  |Butter
 +  |Ice cream
 +  |align="​right"​|1.00
 +  |}
 +
 +----
 +
 +==== Ex. 7 ====
 +
 +<​exttab1>​
 +{| cellspacing="​0"​ border="​1"​
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| cellspacing="​0"​ border="​1"​
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 8 ====
 +
 +<​exttab1>​
 +{| cellpadding="​20"​ cellspacing="​0"​ border="​1"​
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| cellpadding="​20"​ cellspacing="​0"​ border="​1"​
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +===== with HTML attributes and CSS styles =====
 +
 +==== Ex. 9 ====
 +
 +<​exttab1>​
 +{| style="​color:​green;​background-color:#​ffffcc;"​ cellpadding="​20"​ cellspacing="​0"​ border="​1"​
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| style="​color:​green;​background-color:#​ffffcc;"​ cellpadding="​20"​ cellspacing="​0"​ border="​1"​
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +===== table with TH headings =====
 +
 +==== Ex. 10 ====
 +
 +any column
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +!Yummy
 +!Yummier
 +|-
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  !Yummy
 +  !Yummier
 +  |-
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 11 ====
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +! colspan="​2"​|Yummies
 +|-
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  ! colspan="​2"​|Yummies
 +  |-
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 12 ====
 +
 +heading per line
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +!Fruit
 +|Orange
 +|Apple
 +|-
 +!Dish
 +|Bread
 +|Pie
 +|-
 +!Complement
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  !Fruit
 +  |Orange
 +  |Apple
 +  |-
 +  !Dish
 +  |Bread
 +  |Pie
 +  |-
 +  !Complement
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 12 ====
 +
 +heading per lign, aligned right
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +!align="​right"​ |Fruit
 +|Orange
 +|Apple
 +|-
 +!align="​right"​ |Dish
 +|Bread
 +|Pie
 +|-
 +!align="​right"​ |Complement
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  !align="​right"​ |Fruit
 +  |Orange
 +  |Apple
 +  |-
 +  !align="​right"​ |Dish
 +  |Bread
 +  |Pie
 +  |-
 +  !align="​right"​ |Complement
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +===== table with caption =====
 +
 +==== Ex. 13 ====
 +
 +standard: caption above the table
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +|+Food complements
 +|-
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  |+Food complements
 +  |-
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +==== Ex. 14 ====
 +
 +extended: caption under the table
 +
 +<​exttab1>​
 +{| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +|+align="​bottom"​ style="​color:#​e76700;"​|''​Food complements''​
 +|-
 +|Orange
 +|Apple
 +|-
 +|Bread
 +|Pie
 +|-
 +|Butter
 +|Ice cream 
 +|}
 +</​exttab1>​
 +
 +  {| border="​1"​ cellpadding="​20"​ cellspacing="​0"​
 +  |+align="​bottom"​ style="​color:#​e76700;"​|''​Food complements''​
 +  |-
 +  |Orange
 +  |Apple
 +  |-
 +  |Bread
 +  |Pie
 +  |-
 +  |Butter
 +  |Ice cream 
 +  |}
 +
 +----
 +
 +===== some final words =====
 +
 +Here I stop (for now?) -- if I try to put H1...H6 into the tables, the formatting chaos will overwhelm me ;-). Hunting for the correct nesting of HR, TD, and CAPTION tags was quite a game... Maybe the fact that the alignment does not always work correct is caused by the template. Following the produced code it should be aligned correctly :-/
 +
 +Anyone please feel free to modify the code -- and please tell me what and why you did so that I can be happy about these modifications in my own wiki ;-)
users/werner/exttab1_en.txt · Zuletzt geändert: 2006-12-02 1547 von werner