Módulo 03 - TABELAS

Para fazer o efeito zebrado na tabela nas configurações de style configurar tbody > tr:nh-child (2n) { background-color:} que ira pintar a cada duas linhas da tabelas, também pode-se mudar o parâmetro como por exemplo pintar somente os impares tr:nh-child (old) ou pares (even)

Para deixar o cabeçalho da tabela fixo enquanto a página vai rolando para baixo e ainda existe a tabela ➔ em style confiurar table adicionando a propiedade position: relative; e também configurar thead > tr > th{ position: sticky; top: 0; background-color: skyblue; }

para evitar rolagem lateral de toda a página quando tiver uma tabela muito grande horizitalmente, colocar toda a tabela dentro de uma div e nas configurações de css adicionar div. { overflow-x:auto; }

Mesclagem de tabela para que uma coluna ocupe o espaço de duas configurar diretamente na tag td a propiedade colspan="", um exemplo é a célula B da tabela abaixo, já se precisar que uma única célula ocupe mais de uma linha basta configurar a propiedade rowspan=" ", como por exemplo a célular em D

Para destacar uma coluna pode-se fazer atráves do <colgruop>, que deve estar dentro do < table > e conter < col class "nome" > de acordo com a quantidade de colunas da tabela, também é necessário que as ≪ th > estejam com scope definido. também é possível configurar mais de uma coluna adjacente ao mesmo tempo, deve-se colocar a propiedade sapn='n de colunas' dentro de < col >. Para a personalização da coluna basta adicionar em style col.nome{configurações}

EXERCÍCIOS