1. Komponenty

Tabulka

angl. Table

Slouží pro přehledné zobrazení většího množství dat.


<div class="col-xs-16">
        <table>
                <thead>
                    <tr><th>&nbsp;</th><th>Úřední hodiny</th><th>Podatelna</th><th>Pokladna</th></tr>
                </thead>
                <tbody>
                    <tr><th>Pondělí</th><td>8:00-17:00</td><td>8:00-17:00</td><td>8:00-12:00, 13:00-16:30</td></tr>
                    <tr><th>Úterý</th><td>8:00-14:00</td><td>8:00-14:00</td><td>-</td></tr>
                    <tr><th>Středa</th><td>8:00-17:00</td><td>8:00-17:00</td><td>8:00-12:00, 13:00-16:30</td></tr>
                    <tr><th>Čtvrtek</th><td>8:00-14:00</td><td>8:00-14:00</td><td>-</td></tr>
                    <tr><th>Pátek</th><td>8:00-14:00</td><td>8:00-14:00</td><td>-</td></tr>
                </tbody>
        </table>
</div>

Responzivní (RWD) zobrazení

Slouží pro zobrazení na menších zařízeních (mobilech, tabletech).

Pro představu, jak se má komponenta chovat na jiném zařízení, lze náhled komponenty zmenšit podle potřeby. Ke zmenšení dojde stisknutím pravého okraje a potáhnutím doleva. Komponenta se automaticky přeskládá podle míry zmenšení.

Více o typech zařízení najdete na stránce Mřížka.

Použití

Tabulka zobrazuje soubory dat, kterým poskytuje význam. Zároveň datům zachovává čitelnost, data jsou skenovatelná a snadno srovnatelná. Pomocí tabulky může uživatel porovnávat informace v řádcích a sloupcích.

  • Použijte pro snadnější porovnání a vyhledávání

  • Nepoužívejte k rozvržení obsahu na stránce

Označení

Používejte u tabulek označení, které pomáhá uživateli vyhledávat, navigovat a chápat jednotlivé tabulky.

Záhlaví

Pomocí záhlaví tabulky informujte uživatele o tom, jaké řádky a sloupce tabulka obsahuje.

Užitečné odkazy