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.
Tudo é executado em seu navegador Os dados que você cola são analisados e convertidos em JavaScript em seu próprio dispositivo, para que nada seja carregado, registrado ou armazenado, e a ferramenta continua trabalhando com a rede desconectada depois que a página for carregada Você pode escolher como o estilo é entregue: nomes de classes modernos com um bloco CSS correspondente, estilos embutidos 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 combinar a saída com o projeto no qual você está colando.
Cole linhas separadas por vírgulas ou separadas por tabulações na caixa de entrada O delimitador é detectado automaticamente, ou você pode configurá-lo manualmente se os dados forem ambíguos.
Decida se a primeira linha é um cabeçalho de coluna e se a primeira coluna de cada linha é um cabeçalho de linha, para que os leitores de tela anunciem as células certas.
Adicione uma legenda, ative linhas ou bordas listradas, escolha um layout compacto e escolha CSS baseado em classe, estilos embutidos ou HTML semântico simples.
Clique em Gerar para construir a tabela, depois copie o HTML e, no modo classe, o CSS correspondente em seu projeto Tudo permanece em seu navegador.
Colar dados separados por vírgula, guia, ponto e vírgula ou pipe O delimitador é detectado automaticamente e os campos cotados com separadores incorporados são analisados corretamente.
A primeira linha pode se tornar <th scope="col"> e a primeira coluna <th scope="row">, portanto, a tecnologia assistiva anuncia cabeçalhos para cada célula de dados.
Emita nomes de classes com um bloco CSS correspondente, estilos inline independentes para e-mail ou HTML semântico simples sem estilo, dependendo de onde a tabela chega.
Adicione faixas de zebra, bordas de células, um layout compacto e um elemento <caption>, todos aplicados de forma consistente em todas as linhas da tabela.
Format, beautify, and minify HTML online. Re-indents messy or minified markup, keeps script, style, and pre content verbatim, and runs entirely in your browser.
Convert HTML to clean Markdown instantly. Turns headings, lists, links, images, blockquotes, code blocks and tables into portable GitHub Flavored Markdown. Tolerant of messy CMS markup. 100% client-side.
Build Markdown tables in a spreadsheet-style editor - import CSV, Excel, or an existing table, set alignment, copy clean GFM
Generate a linked table of contents from Markdown headings
0 comments
No comments yet. Be the first to share your thoughts!