Práce s tabulkami v HTML

Nyní se naučíme vytvářet tabulky v HTML. Myslím, že si dokážete představit, co je tabulka v běžném životě - je to soubor řádků a sloupců, na jejichž průsečíku se nacházejí buňky.

V HTML se tabulky vytvářejí podle podobného principu. Také existují sloupce a řádky s buňkami, ale HTML kód tabulek při prvním pohledu se může zdát neobvyklý: tabulky se vytvářejí po řádcích - nejprve první řádek, pak druhý a tak dále.

Kód tabulky má pevnou strukturu: hlavním je tag table, uvnitř kterého by měly ležet tagy tr, které vytvářejí řádky tabulky, a uvnitř nich - tagy td, které vytvářejí buňky. Tag table může mít atribut border, který nastavuje ohraničení tabulce a jejím buňkám.

Pojďme například vytvořit tabulku se třemi řádky a třemi buňkami v každém řádku:

html<table border="1">
  <tr>
    <td>buňka 1</td>
    <td>buňka 2</td>
    <td>buňka 3</td>
  </tr>
  <tr>
    <td>buňka 4</td>
    <td>buňka 5</td>
    <td>buňka 6</td>
  </tr>
  <tr>
    <td>buňka 7</td>
    <td>buňka 8</td>
    <td>buňka 9</td>
  </tr>
</table>

Результат:

Задание 1

Zopakujte příklad uvedený níže: