Oznaka <tfood>

Oznaka <tfood> se uporablja za združevanje vsebine noge v HTML tabeli in se uporablja skupaj z elementoma <thead> in <tbody<> za določanje vsakega dela tabele posebej. Element <tfoot> mora imeti znotraj eno ali več <tr> oznak. Oznako <tfood> je v tabeli potrebno uporabiti za vsemi ostalimi elementi <caption>, <colgroup>, <thead> in <tbody>.

PRIMER

<!DOCTYPE html>
<html lang="sl">
<head>
    <meta charset="UTF-8">
    <title>uporaba tfood za nogo tabele</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <style>
        table {width: 100%; display: table; table-layout: fixed;}
        table th, td {padding: 10px}
        table th {text-align: left; text-transform: uppercase;background: red;}
        table td {text-transform: capitalize}
        table tfoot {background-color: blue; color: white;}
    </style>
</head>
<body>
<table>
    <caption style="text-align: left">TABELA</caption>
    <colgroup>
        <col style="background: green">
        <col span="2" style="background: orangered">
    </colgroup>

    <thead>
    <tr>
        <th>mesec</th>
        <th>plača</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>januar</td>
        <td>780</td>
    </tr>
    <tr>
        <td>februar</td>
        <td>765</td>
    </tr>
    <tr>
        <td>marec</td>
        <td>777</td>
    </tr>
    <tr>
        <td>april</td>
        <td>810</td>
    </tr>
    <tr>
        <td>maj</td>
        <td>790</td>
    </tr>
    <tr>
        <td>junij</td>
        <td>766</td>
    </tr>
    <tr>
        <td>julij</td>
        <td>757</td>
    </tr>
    <tr>
        <td>avgust</td>
        <td>820</td>
    </tr>
    <tr>
        <td>september</td>
        <td>800</td>
    </tr>
    <tr>
        <td>oktober</td>
        <td>850</td>
    </tr>
    <tr>
        <td>november</td>
        <td>780</td>
    </tr>
    <tr>
        <td>december</td>
        <td>800</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
        <td>SKUPAJ:</td>
        <td>9.495,00 €</td>
    </tr>
    </tfoot>
</table>
</body>
</html>

REZULTAT