Ayuda:Tablas

Ayuda de edición (contenidos)

Artículos

Usando MediaWiki (Referencia rápida)

Las tablas son, como lo dice la palabra, "tablas" que ordenan la información de un modo más o menos convencional. MediaWiki permite un modo para hacer tablas que no está presente en XHTML o HTML, aunque también permite éstos.

Sintaxis con barras verticales

Aunque la sintaxis HTML para tablas funcione, el código wiki puede ser usado para crear una tabla de la siguiente forma:

La tabla entera comienza con una línea "{| parámetros opcionales para la tabla " y finaliza con la línea "|}".
Una leyenda opcional se incluye con la línea "|+ leyenda " luego de "{|".
El código para una fila consiste en una línea "|- parámetros opcionales para la tabla " y comenzando en una nueva fila, los códigos para las celdas en la fila están separados por nueva línea o "|".
Datos de tabla son los códigos para las celdas; el código de la celda está formado por "| valor " o "| parámetros de celda | valor ".
Una fila de títulos de columna se identifica usando "!" en lugar de "|", excepto para la separación entre un parámetro de celda y un valor; la diferencia con una fila normal depende del navegador, los títulos de columna están frecuentemente presentados en negritas.
La primera celda de la fila es identificada como fila de títulos si comienza la línea con "!" en lugar de "|", y comienzan las subsecuentes celdas de datos en una nueva línea.

Los parámetros de tabla y de celdas son los mismos como en HTML, ver (página en inglés) y HTML element#Tables (wiki en inglés). Sin embargo los elementos thead, tbody, tfoot, colgroup y col actualmente no son soportados en MediaWiki.

Una tabla puede ser útil aun si ninguna de sus celdas tiene contenido, notablemente porque con el uso de colores de fondo de celdas la tabla puede ser un diagrama; vea por ejemplo Ajedrez#el tablero de ajedrez. Una "imagen" en forma de una tabla es mucho más conveniente para editar una imagen subida.

Cada fila debe tener el mismo número de celdas que las otras filas, así el número de columnas en la tabla continúa siendo consistente (a menos que haya celdas que abarquen varias columnas o filas, vea colspan y rowspan en ejemplo mezcla más abajo). Para celdas vacías, use el espacio “non-breaking”   como contenido para asegurar que las celdas sean mostradas.

Ejemplos

Ejemplo simple

{| 
| Celda 1, Fila 1
| Celda 2, Fila 1
|- 
| Celda 1, Fila 2 
| Celda 2, Fila 2 
|}

y

{| 
| Celda 1, Fila 1 || Celda 2, Fila 1 
|- 
| Celda 1, Fila 2 || Celda 2, Fila 2 
|}

ambos generan

Celda 1, Fila 1	Celda 2, Fila 1
Celda 1, Fila 2	Celda 2, Fila 2

Tabla de multiplicar

Hemos complicado un poco esta tabla poniendo atributos de alineación a celdas y a filas enteras para que pueda apreciar cómo se ponen los atributos a nivel de fila y a nivel de celda cuando las celdas se escriben sobre la misma línea de código.

Obsérvese también que NO se pueden mezclar en una misma línea de código una celda de datos y una celda de título.

Código fuente

{| border="1" cellpadding="2"
|+ Tabla de multiplicar
|-
! &times; !! align="right" | 1 !! align="right" | 2 !! align="right" | 3
|-
! align="right" | 1
| align="right" | 1 || align="right" | 2 || align="right" | 3
|- align="right"
! 2
| 2 || 4 || 6
|- align="right"
! 3
| 3 || 6 || 9
|- align="right"
! 4
| 4 || 8 || 12
|- align="right"
! 5
| 5 || 10 || 15
|}

Apariencia

Tabla de multiplicar
×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

Color; alcance de parámetros

Hay dos formas de especificar el color del texto y del fondo para una sola celda:

{| 
| bgcolor="red" | <font color="white" > abc
| def
| style="background:red; color:white" | ghi
| jkl
|}

abc

def

ghi

jkl

Como se ve “font” funciona para una sola celda, aún sin etiqueta de cierre: la etiqueta de cierre es añadida por el sistema. Nota: se desaconseja utilizar esta etiqueta ya que está desaprobada en HTML 4 en beneficio del atributo style.

Como otros parámetros, los colores pueden también ser especificados para una fila completa o para una tabla completa; los parámetros para una fila sobrescriben los valores para la tabla, y los de una celda sobrescriben los de la fila:

{| style="background:yellow; color:green"
|- 
| abc
| def
| ghi
|- style="background:red; color:white"
| jkl
| mno
| pqr
|-
| stu
| style="background:silver" | vwx
| yz
|}

da

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

Definir colores

Los nombres de los colores que pueden emplearse en una tabla son:

Black	DarkGreen	MidnightBlue	DarkSlateGray	Navy
Green	Maroon	DarkBlue	DarkRed	DarkOliveGreen
ForestGreen	Indigo	SaddleBrown	DarkSlateBlue	SeaGreen
Brown	Teal	Purple	Olive	OliveDrab
DimGray	FireBrick	Sienna	DarkCyan	DarkMagenta
MediumBlue	LimeGreen	MediumSeaGreen	Gray	SlateGray
DarkGoldenrod	Crimson	SteelBlue	Chocolate	LightSlateGray
MediumVioletRed	IndianRed	CadetBlue	SlateBlue	LightSeaGreen
Peru	Blue	Lime	Red	RoyalBlue
DarkViolet	DarkOrchid	YellowGreen	OrangeRed	BlueViolet
Goldenrod	DarkSeaGreen	RosyBrown	LawnGreen	Tomato
DarkKhaki	SpringGreen	Chartreuse	MediumAquamarine	MediumPurple
PaleVioletRed	MediumSlateBlue	DarkOrange	DarkGray	DarkTurquoise
MediumSpringGreen	MediumOrchid	DodgerBlue	DeepPink	Coral
CornflowerBlue	LightCoral	MediumTurquoise	DarkSalmon	Salmon
Orange	SandyBrown	Tan	GreenYellow	Turquoise
LightGreen	BurlyWood	DeepSkyBlue	LightSalmon	Orchid
HotPink	PaleGreen	Silver	Gold	SkyBlue
LightSteelBlue	LightSkyBlue	Plum	Aquamarine	LightBlue
Thistle	Aqua	Cyan	Fuchsia	Magenta
Yellow	Khaki	Violet	LightGrey	PowderBlue
LightPink	PaleGoldenrod	Wheat	Pink	PaleTurquoise
NavajoWhite	Gainsboro	PeachPuff	Moccasin	Bisque
BlanchedAlmond	AntiqueWhite	PapayaWhip	MistyRose	Lavender
Beige	LightGoldenrodYellow	LemonChiffon	Linen	Cornsilk
OldLace	WhiteSmoke	Honeydew	LightCyan	LightYellow
Seashell	LavenderBlush	AliceBlue	FloralWhite	MintCream
Azure	Ivory	GhostWhite	Snow	White

Los colores se pueden definir como combinación de los tres colores básicos: rojo verde y azul: RGB, si se quiere emplear este modo, se emplean el signo almohadilla (#) seguido de los valores de rojo verde y azul en hexadecimal, como en los ejemplos.

#000000	#004400	#008800	#00cc00	#00ff00
#440000	#444400	#448800	#44cc00	#44ff00
#880000	#884400	#888800	#88cc00	#88ff00
#cc0000	#cc4400	#cc8800	#cccc00	#ccff00
#ff0000	#ff4400	#ff8800	#ffcc00	#ffff00

#000044	#004444	#008844	#00cc44	#00ff44
#440044	#444444	#448844	#44cc44	#44ff44
#880044	#884444	#888844	#88cc44	#88ff44
#cc0044	#cc4444	#cc8844	#cccc44	#ccff44
#ff0044	#ff4444	#ff8844	#ffcc44	#ffff44

#000088	#004488	#008888	#00cc88	#00ff88
#440088	#444488	#448888	#44cc88	#44ff88
#880088	#884488	#888888	#88cc88	#88ff88
#cc0088	#cc4488	#cc8888	#cccc88	#ccff88
#ff0088	#ff4488	#ff8888	#ffcc88	#ffff88

#0000cc	#0044cc	#0088cc	#00cccc	#00ffcc
#4400cc	#4444cc	#4488cc	#44cccc	#44ffcc
#8800cc	#8844cc	#8888cc	#88cccc	#88ffcc
#cc00cc	#cc44cc	#cc88cc	#cccccc	#ccffcc
#ff00cc	#ff44cc	#ff88cc	#ffcccc	#ffffcc

#0000ff	#0044ff	#0088ff	#00ccff	#00ffff
#4400ff	#4444ff	#4488ff	#44ccff	#44ffff
#8800ff	#8844ff	#8888ff	#88ccff	#88ffff
#cc00ff	#cc44ff	#cc88ff	#ccccff	#ccffff
#ff00ff	#ff44ff	#ff88ff	#ffccff	#ffffff

Ancho, alto

El ancho y el alto de toda la tabla puede ser especificado, como así también el alto de una fila. Para especificar el ancho de una columna uno puede especificar el ancho de una celda en la columna arbitrariamente. Si no se especifica el ancho para todas las columnas ni el alto de todas las filas, entonces habrá alguna ambigüedad, y el resultado dependerá del navegador.

{| style="width:400px; height:200px" border="1"
|- 
| abc
| def
| ghi
|- style="height:100px" 
| jkl
| style="width:200px" |mno
| pqr
|-
| stu
| vwx
| yz
|}

da

abc	def	ghi
jkl	mno	pqr
stu	vwx	yz

Posición

Uno puede ubicar la tabla en sí, y todo el contenido de una fila, y el contenido de una celda, pero no con un solo parámetro todo el contenido de una tabla, vea w:en:Template talk:Table demo (en inglés). No use, bajo ninguna circunstancia, “float” para ubicar una tabla. Esto rompería la presentación de la página a fuentes de gran tamaño.

“Ejemplo mezcla”

Aquí hay un ejemplo más avanzado que muestra más opciones disponibles para “maquillar” tablas. Puede jugar con estos ajustes en su propia tabla para ver los efectos que tienen. No todas estas técnicas pueden ser apropiadas en todos los casos; ya que adicionar fondos coloreados, por ejemplo, puede no ser una buena idea. Trate de mantener el “maquillaje” en sus tablas relativamente simple –recuerde , otras personas estarán editando también el artículo. Este ejemplo le da una idea de lo que es posible.

Código fuente

{| border="1" cellpadding="5" cellspacing="0" align="center"
|+'''Una tabla ejemplo'''
|-
! style="background:#efefef;" | Primer encabezado
! colspan="2" style="background:#ffdead;" | Segundo encabezado
|-
| arriba a la izquierda
|  
| rowspan=2 style="border-bottom:3px solid grey;" valign="top" |
lado derecho
|-
| style="border-bottom:3px solid grey;" | abajo a la izquierda
| style="border-bottom:3px solid grey;" | abajo en el medio
|-
| colspan="3" align="center" |
{| border="0"
|+''Una tabla en otra tabla''
|-
| align="center" width="150px" | [[Image:wiki.png]]
| align="center" width="150px" | [[Image:wiki.png]]
|-
| align="center" colspan="2" style="border-top:1px solid red; border-right:1px
          solid red; border-bottom:2px solid red; border-left:1px solid red;" |
Dos logos de Wikiviajes
|}
|}

Apariencia

Una tabla ejemplo
Primer encabezado Segundo encabezado

arriba a la izquierda
lado derecho

abajo a la izquierda abajo en el medio

Una tabla en otra tabla

Dos logos de Wikiviajes

Ejemplo avanzado

{| align=right border=1
| Celda 1, fila 1 
|rowspan=2| Celda 2, fila 1 (y 2) 
| Celda 3, fila 1 
|- 
| Celda 1, fila 2 
| Celda 3, fila 2 
|}

Celda 1, fila 1	Celda 2, fila 1 (y 2)	Celda 3, fila 1
Celda 1, fila 2	Celda 2, fila 1 (y 2)	Celda 3, fila 2

Note la tabla flotante a la derecha

Otro Ejemplo avanzado

{| align=right border=1
|rowspan=3| Columna 1, fila 1, 2 y 3 
| Columna 2, fila 1 
| Columna 3, fila 1
|- 
| Columna 2, fila 2 
| Columna 3, fila 2 
|-
| Columna 2, fila 3
| Columna 3, fila 3
|}

Columna 1, fila 1, 2 y 3	Columna 2, fila 1	Columna 3, fila 1
	Columna 2, fila 2	Columna 3, fila 2
	Columna 2, fila 3	Columna 3, fila 3

Note la tabla flotante a la derecha

Tabla anidada

{| border=1
| &alpha;
|
{| bgcolor=#ABCDEF border=2
|tabla
|-
|anidada
|}
|la tabla original de nuevo
|}

da una tabla anidada

α

tabla

anidada

la tabla original de nuevo

Las tablas anidadas deben comenzar en una nueva línea.

Otras sintaxis de tablas

Otros tipos de sintaxis de tablas que soporta MediaWiki son:

XHTML
HTML y sintaxis wiki <td>

Los tres son soportados por MediaWiki y crean (actualmente) una visualización HTML válida, pero la sintaxis con barras verticales es la más simple, excepto tal vez para las personas que ya están familiarizadas con HTML. También, HTML y sintaxis wiki <td> no necesariamente permanecerán soportadas por los navegadores en el futuro por venir, especialmente por las computadoras de mano (handheld) con posibilidad de acceder a internet.

Vea también HTML element#Tables (wiki en inglés). Note sin embargo que los elementos thead, tbody, tfoot, colgroup y col actualmente no son soportados en MediaWiki.

Comparación

Comparación de sintaxis de tablas

XHTML

HTML & Wiki-td

Wiki-pipe

Tabla

{| parámetros 
|}

Leyenda

|+ leyenda

Fila

<tr>

|- parámetros

Celda de datos

<td>celda1</td>
<td>celda2</td>

<td>celda1
<td>celda2

| celda1
| celda2

Celda de datos

<td>celda1</td> <td>celda2</td> <td>celda3</td>

<td>celda1 <td>celda2 <td>celda3

|celda1||celda2||celda3

Celda encabezado

<th>

! encabezado

Tabla ejemplo

1	2
3	4

<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td> 
      <td>4</td> 
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
</table>

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

Tabla ejemplo

1	2
3	4
5	6

<table>
   <tr>
      <td>1</td>
      <td>2</td>
   </tr> 
   <tr>
      <td>3</td>
      <td>4</td>
   </tr>
   <tr>
      <td>5</td>
      <td>6</td>
   </tr>
</table>

<table>
   <tr>
      <td> 1 <td> 2
   <tr>
      <td> 3 <td> 4
   <tr>
      <td> 5 <td> 6
</table>

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

Pro

Puede ser previsualizado/depurado con cualquier editor XHTML

Puede dársele un formato para mejor lectura

Bien conocido

Puede ser previsualizado/depurado con cualquier editor HTML

Puede dársele un formato para mejor lectura

Bien conocido

Ocupa menos espacio que XHTML

Fácil de escribir

Fácil de leer

Ocupa menos espacio

Cons

Tedioso

Ocupa mucho espacio

Difícil de leer rápidamente

Confusa, especialmente para gente con poca experiencia en HTML

Formato pobre

Pobremente desarrollado

Generalmente tiene aspecto raro

Puede no tener soporte de navegadores en el futuro

Sintaxis no familiar

Estructura rígida

No se pueden colocar sangrías

El texto (como en etiquetas HTML) puede ser más fácil de leer para algunas personas que series de barras verticales, signos de suma, de exclamación, etc.

XHTML

HTML & Wiki-td

Wiki-pipe

Sintaxis de barras verticales en términos de presentación HTML

La sintaxis de barras verticales, desarrollada por Magnus Manske, substituye barras verticales (|) por HTML. Hay un script on-line que convierte tablas HTML a sintaxis de tablas de barras verticales.

Las barras verticales deben estar al comienzo de una nueva línea, excepto cuando separan parámetros de contenido o cuando se usan || para separar celdas en una misma línea. Los parámetros son opcionales.

Tablas

Una tabla está definida por {| ''parámetros'' |} que es igual <table ''parámetros''>Insertar texto sin formato aquí </table>

Cuidado: Debe incluir un espacio entre {| y los parámetros, o el primer parámetro será ingnorado.

Filas

Las etiquetas <tr> serán generadas automáticamente por la primera fila. Para comenzar una nueva fila, use

|-

que resulta en <tr> Los parámetros pueden ser adicionados de la siguiente forma: |- parámetros que resultan en <tr parámetros>

Nota:

Las etiquetas <tr> serán automáticamente abiertas al primer equivalente <td>
Las etiquetas <tr> serán automáticamente cerradas a los equivalentes <tr> y </table>

Celdas

Las celdas son generadas por cualquiera de las siguientes formas:

|celda1
|celda2
|celda3

o

|celda1||celda2||celda3

ambas son iguales a

<td>celda1</td><td>celda2</td><td>celda3</td>

así "||" es igual a "nueva línea" + "|"

Parámetros en celdas pueden ser usados de la siguiente forma:

|parámetros|celda1||parámetros|celda2||parámetros|celda3

que resultará en <td parámetros>

Encabezados

Las funciones funcionan de la misma forma que TD, excepto "!" es usado en vez del "|" de comienzo. "!!" puede ser usado en vez de "||". Los parámetros sin embargo usan "|". Ejemplo:

!parámetros|celda1

Leyendas

Una etiqueta <caption> (leyenda) es creada por

|+ Leyenda

que genera

<caption>Leyenda</caption>

También puede usar parámetros:

|+ parámetros|Leyenda

que generará

<caption parámetros>Leyenda</caption>

Texto próximo a una tabla

(Para ver los efectos debe aumentar o disminuir el tamaño de la fuente del navegador; también puede cambiar el ancho de la ventana del navegador.)

Puede usar align=right, y el texto que sigue a la tabla aparecerá a la izquierda de la misma.

Tabla de multiplicar 5*3
×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

aquí comienza el texto inmediatamente después de la tabla de multiplicar 5*3 texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto suficiente de este texto.

Sin embargo, no puede colocar texto preformateado, este puede solaparse a la tabla. Para prevenir esto use <br style="clear:both;">:

Tabla de multiplicar 4*3
×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12

aquí comienza el texto inmediatamente después de la tabla de multiplicar 4*3… texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto este es el fin del texto ahora viene el claro BR:

el texto preformateado empezaría solo luego de que la tabla finalizó texto texto texto texto

Puede usar align=left, y la tabla aparecerá a la izquierda y el texto que sigue a la misma a la derecha (pero posiblemente demasiado cerca):

Tabla de multiplicar 2*3
×	1	2	3
1	1	2	3
2	2	4	6

aquí comienza el texto inmediatamente después de la tabla de multiplicar 2*3 texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto

Espacio alrededor de una tabla, imagen o texto

Para crear espacio alrededor de una tabla, imagen o texto cree una tabla de 1x1 alrededor de éstos con “cellpadding:

Tabla de multiplicar
×	1	2	3
1	1	2	3
2	2	4	6

texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto

Texto en caja

texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto TeXto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto

Ajustando el ancho de las columnas

Si quiere forzar el ancho de columna a sus propios requerimientos más que aceptar el ancho del mayor elemento en una celda de una columna entonces siga este ejemplo. Note que el espacio alrededor del texto esta impuesto.

{| border="1" cellpadding="2"
!width="50"|Nombre
!width="225"|Efecto
!width="225"|En que juego se encuentra
|-
|Pokeball
|Pokeball normal
|Todas las versiones
|-
|Great Ball
|Mejor que un Pokeball
|Todas las versiones
|}

Nombre Efecto En que juego se encuentra

Pokeball Pokeball normal Todas las versiones

Great Ball Mejor que un Pokeball Todas las versiones

Ajustando parámetros

Al comienzo de una celda adicione su parámetro seguido de una sola barra vertical. Por ejemplo width=300px| esto determinará una celda con un ancho de 300 píxeles. Para establecer más de un parámetro deje un espacio entre cada uno.

Código Wikiviajes

{|
|-
| bgcolor=red|celda1 || width=300px bgcolor=blue|celda2 || bgcolor=green|celda3
|}

Que se verá así en su navegador

celda1 celda2 celda3

Alineación del punto decimal

Un método para obtener columnas de números alineadas en el punto decimal es como sigue:

<blockquote>
{| cellpadding=0 cellspacing=0
|align=right| 432 || . || 1
|-
|align=right| 43 || . || 21
|-
|align=right| 4 || . || 321
|}
</blockquote>

que da

432 . 1

43 . 21

4 . 321

En casos simples uno puede administrar un rasgo de tabla y simplemente comenzar la línea con un espacio y poniendo espacios en la posición de los números:

432.1
 43.21
  4.321

Estilo predeterminado

Por "class"

Añadiendo líneas a MediaWiki:Common.css se puede crear una "class" predeterminada de tablas. De este modo, se puede añadir, luego del {|, un parámetro class="XXXX".

Una "class" común es la "wikitable".

{| class="wikitable"
|+Tabla de multiplicar
|-
! × !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

se convierte en

Tabla de multiplicar
×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

Por plantillas

Algunos usuarios han creado plantillas para hacer tablas con estilo más fácilmente. En vez de recordar parámetros de tablas puede incluir una plantilla de estilo apropiada después de {|. Esta ayuda conserva el formato de tablas consistente y puede permitir que un simple cambio en la plantilla repare un problema o realce la apariencia de todas las tablas que la usen. Por ejemplo:

{| {{tablabonita}}
|+Tabla de multiplicar
|-
! × !! 1 !! 2 !! 3
|-
! 1
| 1 || 2 || 3
|-
! 2
| 2 || 4 || 6
|-
! 3
| 3 || 6 || 9
|-
! 4
| 4 || 8 || 12
|-
! 5
| 5 || 10 || 15
|}

se convierte en:

Tabla de multiplicar
×	1	2	3
1	1	2	3
2	2	4	6
3	3	6	9
4	4	8	12
5	5	10	15

simplemente reemplazando la sección border="1" cellpadding="2" con {{tablabonita}}, porque esta plantilla contiene las siguientes reglas de estilo:

Plantilla:Tablabonita.

Todas estas plantillas deberían estar organizadas/listadas en un solo lugar como aquí.

Galería

Como un subproducto de la característica de galería de imágenes, una tabla puede ser hecha con una etiqueta de galería; si una entrada de texto contiene un link, la entrada entera es ignorada.

<gallery>
Drenthe
Flevoland
Friesland
Gelderland
Imagen:Wikivoyage-Logo-v3-en.svg|Logo de Wikiviajes en Inglés
Imagen:Wikivoyage-Logo-v3-es.svg|Logo de Wikiviajes en Español
Imagen:Wikivoyage-Logo-v3-ar.svg|Logo de Wikiviajes en Árabe
Imagen:Wikivoyage-Logo-v3-zh-hant.svg|Logo de Wikiviajes en Chino
</gallery>

da:

Logo de Wikiviajes en Inglés
Logo de Wikiviajes en Español
Logo de Wikiviajes en Árabe
Logo de Wikiviajes en Chino

Nombre	Efecto	En que juego se encuentra
Pokeball	Pokeball normal	Todas las versiones
Great Ball	Mejor que un Pokeball	Todas las versiones