Tablas en HTML (1)

 La estructura básicas para generar una tabla con HTML es la siguiente:

<table>

    <thead>

        <tr>

            <th>dato1</th>

            <th>dato2</th>

            <th>dato3</th>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td>dato1</td>

            <td>dato2</td>

            <td>dato3</td>

        </tr>

        <tr>

            <td>dato4</td>

            <td>dato5</td>

            <td>dato6</td>

        </tr>

    </tbody>

    <tfoot>

        <tr>

            <td>dato7</td>

            <td>dato8</td>

            <td>dato9</td>

        </tr>

    </tfoot>

    <caption>Aquí debería ir una descripción de los datos de esta tabla</caption>

<table/>

El resultado de estas lineas de HTML es:

Aquí debería ir una descripción de los datos de esta tabla

dato1	dato2	dato3
dato1	dato2	dato3
dato4	dato5	dato6
dato7	dato8	dato9

Aplicando un poco de estilo en la etiqueta table podemos agregar los bordes.

<table border="1">...

Dejando nuestra tabla con este aspecto básico:

Aquí debería ir una descripción de los datos de esta tabla

dato1	dato2	dato3
dato1	dato2	dato3
dato4	dato5	dato6
dato7	dato8	dato9

El resultado es básico y debemos hacer mejoras a través de CSS, por ejemplo:

Aquí debería ir una descripción de los datos de esta tabla

Encabezado 1	Encabezado 2	Encabezado 3
dato1	dato2	dato3 con más contenido
dato4 con más contenido	dato5 con más contenido	dato6
dato7	dato8	dato9 con más contenido