Saltar para o conteúdo

Edição de tabelas wiki/As células

Origem: Wikilivros, livros abertos por um mundo aberto.

Será possível perceber que muito do que será apresentado aqui é similar ao que foi mostrado no capítulo Declaração. Porém, por os efeitos serem diferentes, convém redemonstrar.

Ajusta a fusão de colunas. Por padrão o texto fica alinha à esquerda.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|colspan=2|consectetuer
|-
|adipiscing elit
|Etiam eget
|}
Lorem ipsum dolor sit amet
consectetuer
adipiscing elit Etiam eget

Ajusta a fusão de linhas. Por padrão o texto fica alinhado à esquerda horizontal e ao centro vertical.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|rowspan=2|consectetuer
|adipiscing elit
|-
|Etiam eget
|}
Lorem ipsum dolor sit amet
consectetuer adipiscing elit
Etiam eget

Faz alterações visuais na tabela. Ao usar mais de uma opção, deve-se separá-las por ponto-e-vírgula.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|style="background: yellow"|consectetuer
|style="background: blue"|adipiscing elit
|-
|Etiam eget
|style="background: red"|ligula eu lectu
|}
Lorem ipsum dolor sit amet
consectetuer adipiscing elit
Etiam eget ligula eu lectu

Define a cor do texto da célula.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|style="color: green"|consectetuer
|style="color: red"|adipiscing elit
|-
|style="color: yellow"|Etiam eget
|ligula eu lectu
|}
Lorem ipsum dolor sit amet
consectetuer adipiscing elit
Etiam eget ligula eu lectu

Alinha o conteúdo da célula em relação às bordas da mesma (não apenas o texto). As opções possíveis são left, right ou center. Se não for incluído, o padrão será left.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|style="text-align:right"|consectetuer
|style="text-align:center"|adipiscing elit
|-
|Etiam eget
|style="text-align:right"|ligula eu lectu
|}
Lorem ipsum dolor sit amet consectetuer
adipiscing elit
Etiam eget ligula eu lectu

vertical-align

[editar | editar código-fonte]

Ajusta o alinhamento vertical do texto. O rowspan será usado neste exemplo para que o efeito possa ser observado. Os valores possível são top.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|rowspan=2 'style="vertical-align: top"|consectetuer
|adipiscing elit
|-
|Etiam eget
|}


Lorem ipsum dolor sit amet
consectetuer adipiscing elit
Etiam eget

Regula a largura da célula em relação à página, percentualmente ou em pixels. Note que ao configurar este parâmetro para uma célula, toda a coluna será alterada.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|style="width: 100%"|consectetuer
|adipiscing elit
|-
|Etiam eget
|ligula eu lectu
|}


Lorem ipsum dolor sit amet
consectetuer adipiscing elit
Etiam eget ligula eu lectu

Configura o espaço em branco. Quando configurado com nowrap impede a quebra de linha do texto.

{|class="wikitable"
!Lorem ipsum
!dolor sit amet
|-
|style="white-space: nowrap"|Lorem ipsum dolor sit amet consectetuer adipiscing elit
|adipiscing elit
|-
|Etiam eget
|ligula eu lectu
|}


Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet consectetuer adipiscing elit adipiscing elit
Etiam eget ligula eu lectu