De CriaçãoWiki, a enciclopédia da ciência da criação.
Esta página fornece ajuda em formatação para criar tabelas. Tabelas podem ser criadas em páginas wiki usando qualquer um dos elementos de tabelas HTML diretamente, ou utilizando a formatação wikicode para definir a tabela. Elementos de tabela HTML e seu uso estão bem descritos em várias páginas da web e não serão discutidos aqui. O benefício do wikicode é que a tabela é construída por símbolos de caracteres, que tendem a tornar mais fácil de perceber a estrutura da tabela na visão de edição do artigo em comparação com os elementos de uma tabela HTML.
Uma boa regra geral de ouro é evitar o uso de uma tabela, a menos que você precise. Marcação de tabelas, muitas vezes complicam a edição de páginas.
Resumo de marcações de tabelas Wiki
{| |
início da tabela
|
|+ |
legenda da tabela, opcional; apenas uma por tabela e entre o início da tabela e a primeira linha
|
|- |
linha da tabela, opcional na primeira linha -- a engine wiki assume a primeira linha
|
! |
célula de cabeçalho da tabela, opcional. Cabeçalhos da tabela consecutivos podem ser adicionados na mesma linha separados por pontos de exclamação duplos (!!) ou iniciar em novas linhas, cada uma com seu própria ponto de exclamação único (!).
|
| |
célula de dados da tabela, obrigatório! Células da tabela de dados consecutivos podem ser adicionados na mesma linha separados por dois "pipes" (||) ou iniciar em novas linhas, cada uma com seu próprio símbolo de "pipe" único (|).
|
|} |
fim da tabela
|
- A marcas acima devem começar em uma nova linha exceto o duplo pipe || e o duplo ponto de exclamação !! para adicionar opcionalmente células consecutivas a uma linha.
- Atributos XHTML. Cada marca, exceto o fimd e tabela, opcionalmente aceita um ou mais atributos XHTML. Os atributos devem estar na mesma linha como as marcas. Se separam os atributos um do outro por um espaço simples.
- Células e legenda (| ou ||, ! ou !!, e |+) guardam conteúdo. Assim, separe todos os atributos de conteúdo com um único pipe (|). O conteúdo da célula pode seguir na mesma linha ou em linhas que se seguem.
- Tabelas e marcas de linha ({| e |-) não guardam conteúdo diretamente. Não adicione pipes (|) após os seus atributos opcionais. Se você erroneamente adicionar um pipe depois de algum atributo de marca da tabela ou da linha o analisador irá excluí-lo e o seu atributo final se ele estiver tocando o pipe com erro!
- Conteúdo pode (a) seguir a sua marca de célula na mesma linha depois de quaisquer atributos opcionais XHTML ou (b) em linhas abaixo da marca de célula. Conteúdo que utiliza marcação wiki que ele próprio precisa para começar em uma nova linha, tais como listas, cabeçalhos, ou tabelas aninhadas, devem ser, obviamente, em sua própria linha nova.
Tabela simples
Lisa (sem bordas)
A tabela a seguir carece de bordas e um bom espaçamento, mas mostra a estrutura de tabelas de marcação wiki mais simples
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{|
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Alternativa
Para uma forma com mais jeito de tabela, células de marcação wiki podem ser listadas em uma linha separadas por ||. Isto não escala bem para o conteúdo da célula, tais como parágrafos. Ele funciona bem para pedaços curtos de conteúdo no entanto, como a nossa tabela de exemplo.
Espaços extra no interior das células na marcação wiki podem ser adicionados, como eu fiz na marcação wiki abaixo, para fazer a marcação wiki ela própria parecer melhor, mas eles não afetam o processamento da tabela atual.
Atributos de HTML pode ser adicionados a esta tabela seguindo os exemplos de outras tabelas nessa página, mas foram deixados de fora do exemplo a seguir por simplicidade.
Laranja |
Maçã |
mais
|
Pão |
Torta |
mais
|
Manteiga |
Sorvete |
e mais
|
|
{|
| Laranja || Maçã || mais
|-
| Pão || Torta || mais
|-
| Manteiga || Sorvete || e mais
|}
|
Com atributos HTML
Você pode adicionar atributos HTML para tornar a aparência de tua tabela mais bonita
border="1"
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="1"
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
align="center" border="1"
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| align="center" border="1"
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
align="right" border="1"
Você pode colocar atributos sobre células indivíduais. Números, por exemplo, podem parecer melhor alinhados à direita
Laranja
|
Maçã
|
12,333.00
|
Pão
|
Torta
|
500.00
|
Manteiga
|
Sorvete
|
1.00
|
|
{| border="1"
|Laranja
|Maçã
|align="right"|12,333.00
|-
|Pão
|Torta
|align="right"|500.00
|-
|Manteiga
|Sorvete
|align="right"|1.00
|}
|
Você pode colocar atributos em linhas individuais também.
Laranja
|
Maçã
|
12,333.00
|
Pão
|
Torta
|
500.00
|
Manteiga
|
Sorvete
|
1.00
|
|
{| border="1"
|Laranja
|Maçã
|align="right"|12,333.00
|-
|Pão
|Torta
|align="right"|500.00
|- style="font-style:italic;color:green;"
|Manteiga
|Sorvete
|align="right"|1.00
|}
|
cellspacing="0" border="1"
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| cellspacing="0" border="1"
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
cellpadding="20" cellspacing="0" border="1"
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| cellpadding="20" cellspacing="0" border="1"
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Com atributos HTML e estilos CSS
Atributos de estilo CSS podem ser adicionadoscom ou sem atributos HTML
style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Tabela com títulos(cabeçalhos) TH
TH (títulos de tabela HTML) podem ser criados usando-se ! no lugar de |. Títulos usualmente são exibidos em negrito e centralizados por default.
Principais títulos
Cada coluna
Yummy
|
Yummier
|
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Yummy
!Yummier
|-
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Colspan="2"
Yummies
|
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
! colspan="2"|Yummies
|-
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Títulos secundários
Default
Fruta
|
Laranja
|
Maçã
|
Prato
|
Pão
|
Torta
|
Complemento
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Fruta
|Laranja
|Maçã
|-
!Prato
|Pão
|Torta
|-
!Complemento
|Manteiga
|Sorvete
|}
|
Alinhar à direita
Títulos secundários justificados à direita podem ser feito da seguinte forma
Fruta
|
Laranja
|
Maçã
|
Prato
|
Pão
|
Torta
|
Complemento
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
!align="right" |Fruta
|Laranja
|Maçã
|-
!align="right" |Prato
|Pão
|Torta
|-
!align="right" |Complemento
|Manteiga
|Sorvete
|}
|
Legendas
Uma legenda de tabela pode ser adicionada ao topo de qualquer tabela como segue
Alimentos complementares
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+Alimentos complementares
|-
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Atributos podem ser adicionados para a legenda da seguinte forma
Alimentos complementares
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+align="bottom" style="color:#e76700;"|''Alimentos complementares''
|-
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Tabelas com títulos H1, H2, H3 etc.
Títulos HTML H1, H2, H3, H4 etc. podem ser criados da forma padrão de marcação wiki com sinais de ==igual== e devem estar em uma linha por si mesmos para funcionar.
Visualize toda a tabela. Se você clicar em uma aba de edição de um título dentro de uma tabela, edit, e visualização, a tabela pai vai exibir erroneamente quebrada, porque parte dela estará ausente.
Mantenha a hierarquia de títulos compatíveis com o resto da página para que a tabela de conteúdos no topo da página funcione corretamente.
Yummiest
|
Laranja
|
Maçã
|
Pão
|
Torta
|
Manteiga
|
Sorvete
|
|
{| border="3" cellpadding="20" cellspacing="0"
|colspan="2"|
===Yummiest===
|-
|Laranja
|Maçã
|-
|Pão
|Torta
|-
|Manteiga
|Sorvete
|}
|
Embargo
Números negativos
O sinal de menos dos valores negativos pode quebrar sua tabela (pode exibir faltando alguns valores) se você começar uma célula em uma nova linha com um número negativo ou um parâmetro que avalia um número negativo (|-6) porque essa é a marcação wiki para uma linha da tabela, e não para uma célula da tabela. Para evitar isso, insira um espaço antes do valor (| -6) ou use uma marcação in-line na célula (| | -6).