A propriedade de exibição CSS permite que você defina regras para exibição que tornam a sua exibição de conteúdo como uma grade ou como se fosse uma tabela, quando na verdade o material não é uma mesa. Usando CSS para criar um layout de grade lhe dá o controle sobre o layout, sem colocar quaisquer marcas de tabela para o HTML. As propriedades de exibição que se relacionam com uma aparência de tipo tabela, incluindo cada propriedade e valor possível, serão descritos neste artigo.
Coisas que você precisa
- Uma página HTML
- A folha de estilo
instruções
display: table torna o elemento ato como um elemento de tabela. Se você linhas ninho ou colunas de grades dentro deste elemento, você deve usar uma ou mais das propriedades descritas a seguir.
display: table-row torna o elemento agir como um elemento de linha da tabela. É possível usar display: table-row eficazmente sem tê-lo aninhado em um elemento definido como display: table. Isto é porque o navegador assume a existência de uma "anônimo" elemento de tabela e se comporta como se fosse lá. (Veja dicas abaixo para saber mais sobre "anônimo" elementos.) Lembre-se, você não está criando uma tabela real de tabular de dados você está apenas criando uma exibição de grade-like.
display: table-cell torna o elemento agir como um elemento de célula da tabela. É possível usar display: table-cell efetivamente sem ter o elemento aninhado em um elemento definido como display: table-linha ou display: table.
display: table-row-grupo faz com que o elemento de agir como um elemento de grupo de linhas da tabela. Use-o para um elemento que grupos de uma ou mais linhas. É a maneira de expressar o que CSS tbody faz em HTML.
display: table-header-grupo faz com que o elemento de agir como um elemento de grupo de linhas cabeçalho da tabela. É a maneira de expressar o que CSS thead faz em HTML. Com CSS, o-header-group tabela é sempre exibido antes de todas as outras linhas e rowgroups e após quaisquer legendas de topo.
display: table-footer-grupo faz com que o elemento de agir como um elemento de grupo de linhas da tabela rodapé. Com CSS, o rodapé do grupo tabela faz o que tfoot faz em HTML. A-footer-grupo tabela é sempre exibido após todas as outras linhas e rowgroups e antes de qualquer legenda inferior. Impressoras podem repetir linhas de rodapé em cada página gerado por uma mesa.
display: table-caption faz com que o elemento de agir como um elemento de legenda da tabela.
display: tabela de coluna faz com que o elemento de agir como um elemento coluna da tabela. É a maneira de expressar o que CSS col faz em HTML.
display: table-column-grupo faz com que o elemento de agir como um grupo coluna da tabela. Use-o para um grupo ou mais colunas. É a maneira de expressar o que CSS colgroup faz em HTML.
dicas & avisos
- Qualquer display: elemento de tabela irá gerar automaticamente necessários objetos de tabela anônimo em torno de si.
- Qualquer selector na sua folha de estilo definida como uma dessas propriedades de exibição podem ser decorados com toda a gama de regras CSS incluindo estofamento, margem, borda, fundo e font-family.
- propriedades de exibição CSS não são suportados por versões do Internet Explorer abaixo Versão 8.
Como dividir dados do excel tabela dinâmica em planilhas separadas dentro da mesma pasta de trabalho
Como girar o texto em uma tabela html
Como usar o visor css: table-linha e display: propriedades de células da tabela
Como ensinar a tabela periódica para alunos do quinto ano
Como encontrar elétrons para um isótopo