- Página Inicial
- Códigos HTML Prontos
- HTML colgroup
- Voltar
HTML colgroup
A tag HTML <colgroup> agrupa um conjunto de colunas em uma tabela HTML para que você possa aplicar formatação ou adicionar classes ao grupo em vez de cada célula individual.
Definição e uso da Tag <colgroup>
.
A Tag <colgroup>
especifica um grupo de uma ou mais colunas em uma tabela para formatação.
A Tag <colgroup>
é útil para aplicar estilos a colunas inteiras, em vez de repetir os estilos para cada célula, para cada linha.
Observação: a tag <colgroup>
deve ser filha de um elemento <table>, após qualquer elemento <caption> e antes de qualquer elemento <thead>, <tbody>, <tfoot> e <tr>.
Para definir diferentes propriedades para uma coluna dentro de um <colgroup>
, use a tag <col> dentro da tag <colgroup>
.
Veja o exemplo no código Html.
Para definir a cor de fundo das três colunas com as tags <colgroup> e <col>:
<table> <colgroup> <col style="background-color:yellow; "> <col style="background-color:orange; "> <col style="background-color:green; "> </colgroup> <tr> <th>Frutas</th> <th>Legumes</th> <th>Verduras</th> </tr> <tr> <td>Morango</td> <td>Batata</td> <td>Couve</td> </tr> </table>
Veja outro exemplo!
Se você quiser que as duas colunas fique da mesma cor adicione o <col span="2">
.
<table> <colgroup> <col span="2" style="background-color:yellow;"> <col style="background-color:green;"> </colgroup> <tr> <th>Frutas</th> <th>Legumes</th> <th>Verduras</th> </tr> <tr> <td>Morango</td> <td>Batata</td> <td>Couve</td> </tr> </table>
Neste Artigo Abordamos sobre a tag HTML colgroup.
Veja Outros Artigos Relacionados Sobre Html Table.
Publicado por: Loop Nerd
334 Visualizações
\fewfew