Gerador de tabelas HTML

Um gerador de tabelas HTML transforma linhas de dados na marcação HTML que os renderiza como uma tabela em um navegador Você cola valores separados por vírgulas ou separados por tabulações, escolhe como a tabela deve ficar e a ferramenta grava um elemento <table> completo com <thead>, <tbody> e linhas e células da tabela Em vez de digitar manualmente cada <tr>, <th> e <td> e contar células para manter as colunas alinhadas, você cola os dados uma vez e copia a marcação de backup que está pronta para ser lançada em uma página da web, um modelo de e-mail ou um arquivo de documentação.

Existe porque escrever HTML de tabela à mão é repetitivo e propenso a erros Uma tabela com dez linhas e cinco colunas precisa de mais de cinquenta tags de células, todas corretamente abertas e fechadas, e um único </td> em falta quebra o layout A acessibilidade adiciona mais detalhes: as células de cabeçalho devem ser <th> com um atributo de escopo para que os leitores de tela os anunciem, e uma tabela geralmente precisa de um <caption> que descreva seu conteúdo Este gerador aplica essas regras para você A primeira linha pode se tornar um cabeçalho adequado, a primeira coluna de cada linha pode se tornar um cabeçalho de linha e cada valor de célula é HTML-escapado para que caracteres como < e & exibam como texto em vez de quebrar a página.

A conversão é executada no lado do cliente Os dados que você cola são analisados e convertidos em JavaScript em seu próprio dispositivo, para que as linhas nunca sejam carregadas; pressionando Gerar registra um registro de uso que carrega apenas o modo de estilo, e a ferramenta continua trabalhando com a rede desconectada assim que a página for carregada Você pode escolher como o estilo é entregue: nomes de classes modernos com um bloco CSS correspondente, estilos inline independentes que sobrevivem sendo colados em um e-mail ou HTML semântico simples sem nenhum estilo Opções para linhas listradas, bordas, um layout compacto e recuo permitem que você combine a saída com o projeto no qual está colando.

Aqui está um exemplo trabalhado do gerador HTML de tabela Cole três linhas, `,Plan,Price,Seats`, `Free,$0,1` and `Pro",$1,200",10`, type Pricing as the caption and press Gerate A saída é um <table> com <caption>Pricing</caption>, três <th scope="col"> cabeçalhos e duas linhas de corpo, e o citado "$1,200" permanece uma célula em vez de se dividir em sua vírgula Usado como um gerador de tabela para e-mails HTML, alternar Style para estilos Inline e cada célula carrega seu próprio preenchimento e borda, portanto, nenhuma folha de estilo é necessária.