Introdução

Você sabe como criar tabelas em HTML? Neste guia, vamos mostrar como criar tabelas em HTML e atribuir estilos a elas usando CSS.

Utilização de Tabelas em HTML

As tabelas em HTML são comumente utilizadas para exibir dados aos usuários em formato de linhas e colunas. Além disso, elas podem ser empregadas em formulários e em diversos outros contextos.

Exemplos de Tabelas

Aqui estão algumas tags que utilizamos para criar tabelas em HTML:

• <table>: Define a tabela em HTML.
• <tr>: Define uma linha na tabela.
• <th>: Define um cabeçalho de coluna.
• <td>: Define uma célula de dados.

Exemplo de Criação de Tabela

Aqui está um exemplo básico de como criar uma tabela em HTML:

<table>
    <tr>
        <th>Nome</th>
        <th>Idade</th>
    </tr>
    <tr>
        <td>João</td>
        <td>30</td>
    </tr>
    <tr>
        <td>Maria</td>
        <td>25</td>
    </tr>
</table>

Estilizando Tabelas com CSS

Para estilizar todas as tabelas do site, podemos utilizar o seguinte código CSS:

table {
    border-collapse: collapse;
    width: 100%;
    border: 2px solid #ddd;
}
th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

Veja Exemplo formatado:

Tente montar uma tabela como essa acima,e teste seu código abaixo.

Conclusão:

As tabelas em HTML são uma ferramenta poderosa para exibir dados de forma organizada em páginas da web. Com a combinação de tags HTML e estilos CSS, é possível criar tabelas visualmente atraentes e funcionais para diversos fins. Esperamos que este guia tenha sido útil para você começar a trabalhar com tabelas em HTML!Obrigado por ler o nosso conteúdo e esperamos que tenha encontrado informações úteis para seus projetos. Continue explorando o site Exemplificando para mais tutoriais e dicas úteis!

Não deixe de ver outros conteúdos do blog:

• Power Apps
• Excel
• Power BI

Teste seu Código HTML

Cole seu código HTML abaixo e clique em “Testar” para ver o resultado:

Testar