Tabeller

I «gamle dager» ble tabeller brukt (misbrukt) til å definere oppsettet (layout’en) på nettsider. Heldigvis gjøres ikke det i noen særlig grad lenger, og vi har bedre verktøy i CSS-verktøykassa for å håndtere oppsett. Mer om det i CSS-kurset. Den korrekte måten å bruke tabeller på er (du gjettet riktig), å strukturere tabulære data.

Det finnes et lass med tag’er som brukes i forbindelse med tabeller, og det å få en forståelse for alle dem er muligens det vanskeligste i denne nybegynnerdelen av HTML.

Skriv av følgende kode over i HTML-dokumentet ditt, et sted inni body-elementet ditt:

<table>
    <tr>
        <td>Rad 1, celle 1</td>
        <td>Rad 1, celle 2</td>
        <td>Rad 1, celle 3</td>
    </tr>
    <tr>
        <td>Rad 2, celle 1</td>
        <td>Rad 2, celle 2</td>
        <td>Rad 2, celle 3</td>
    </tr>
    <tr>
        <td>Rad 3, celle 1</td>
        <td>Rad 3, celle 2</td>
        <td>Rad 3, celle 3</td>
    </tr>
    <tr>
        <td>Rad 4, celle 1</td>
        <td>Rad 4, celle 2</td>
        <td>Rad 4, celle 3</td>
    </tr>
</table>

table-elementet definerer tabellen.

tr-elementet definerer en tabellrad (table row)

td-elementet definerer en datacelle (table data)

Hvis du ser for deg en tabell som er 3×4 (12 celler), så skal det være fire tr-elementer som definerer radene, og tre td-elementer innenfor hver av radene, som tilsammen utgjør 12 td-elementer.