Tabulky a seznamy


Nadřazené: HTML a CSS

Předcházející: Základy HTML

Cvičení

Rozhodovačka

Seznamy

Nečíslované seznamy vytvoříme pomocí párové značky <ul> (unordered list). Jednotlivé položky seznamu označíme pomocí značky <li> (list item):

<ul>

<li>vlk</li>

<li>los</li>

<li>sob</li>

</ul>
  • vlk
  • los
  • sob

Číslované seznamy vytvoříme pomocí párové značky <ol> (ordered list). Jednotlivé položky označíme opět pomocí značky <li>:

<ol>

<li>vlk</li>

<li>los</li>

<li>sob</li>

</ol>
  1. vlk
  2. los
  3. sob

Typ odrážek a číslování lze změnit pomocí atributu type:

<ol type="A">

<li>vlk</li>

<li>los</li>

<li>sob</li>

</ol>
  1. vlk
  2. los
  3. sob

Tabulky

Tabulku vytvoříme pomocí značky <table>, její řádky pomocí <tr> (table row), buňky pomocí <td> (table data):

<table>

<tr><td>pes</td><td>vlk</td></tr>

<tr><td>los</td><td>sob</td></tr>

</table>
pes vlk
los sob

Pro zvýraznění textu v hlavičce použijeme <th> místo <td>:

<table>

<tr><th>Zvíře</th><th>Výška</th></tr>

<tr><td>los</td><td>180 cm</td></tr>

<tr><td>sob</td><td>120 cm</td></tr>

</table>
Zvíře Výška
los 180 cm
sob 120 cm

Výchozí zobrazení tabulek je typicky bez čar oddělujících jednotlivé buňky. Vzhled lze změnit pomocí kaskádových stylů (CSS).

Spojování buněk

Buňky lze spojovat pomocí atributů rowspan a colspan. Hodnota atributu udává, kolik řádků či sloupců slučujeme.

<table>

<tr><td rowspan=2>vlk</td><td colspan=2>pes</td></tr>

<tr><td>los</td><td>sob</td></tr>

</table>
vlk pes
los sob


Vysvětlení mi pomohlo   Vysvětlení mi nepomohlo

Rozhodovačka

Rychlé procvičování výběrem ze dvou možností.


Tabulky a seznamy   


NAPIŠTE NÁM

Nevíte si rady?

Nejprve se prosím podívejte na časté dotazy:

Časté dotazy Návody pro rodiče Návody pro učitele

Čeho se zpráva týká?

Vzkaz Obsah Ovládání Přihlášení Licence