Em tabelas maiores muitas vezes é uma ajuda para a leitura ter alternando as cores de fundo para todas as outras linhas na tabela. Ele pode ajudar os leitores a seguir linhas em toda a mesa. É fácil de implementar com CSS. Aqui está como.
Coisas que você precisa
- conhecimento de HTML básico
- Conhecimentos básicos CSS
- editor HTML
instruções
- 1
Aqui está uma tabela simples com linhas alternadas cinza e branco. Esta técnica irá trabalhar para qualquer esquema de cores ou qualquer mesa de tamanho.
- 2
Construir a tabela usando suas ferramentas normais de construção de tabela HTML.
- 3
Na folha de estilo, criar uma classe que pode ser aplicado a alternância de elementos TR (linha de tabela). Aqui está um exemplo:
.rowcolor {background: # CCCCCC-}
- 4
No HTML, adicione a classe para linhas alternadas na sua tabela. Aplique-o ao elemento TR. Veja a imagem, por exemplo.
- 5
Se você gostaria de ter uma cor diferente para a linha da tabela que contém os cabeçalhos, você pode criar uma nova classe ou regra id em sua folha de estilo que só irá aplicar uma cor de fundo para os elementos TH.
dicas & avisos
- A tabela a foto acima está usando o "border-collapse: colapso" governar para remover o espaço vazio entre as bordas da tabela.
Como mover texto abaixo uma tabela em html
Como girar o texto em uma tabela html
Como usar o visor css: table-linha e display: propriedades de células da tabela