Tvorba WWW stránek (1TWS)

Tabulky jsou nejnáročnější strukturou v HTML. Už ze své podstaty, ke je třeba vyjádřit řádky a slouce se neobejdeme s jedním nebo dvěma vnořenými elementy. Nejlepším způsobem, jak si problematiku tabulek ukázat bude příklad, který si následně popíšeme.

<table>
  <tr>
    <td>řádek 1 sloupec 1 </td>
    <td>řádek 1 sloupec 2 </td>
    <td>řádek 1 sloupec 3 </td>
  </tr>
  <tr>
    <td>řádek 2 sloupec 1 </td>
    <td>řádek 2 sloupec 2 </td>
    <td>řádek 2 sloupec 3 </td>
  </tr>
</table>

Celá tabulka jak je vidět je uzavřena do elementu <table> ve kterém jsou vnořeny elementy pro řádky <tr> [table row]. V každém řádku jsou pak elementy odkazující na sloupce, přesněji řečeno na buňky, nebo-li data. Z toho vyplývá i název elementu <td> [table data].

Všechny zmíněné elementy mají spoustu atributů, ale jejich podpora v prohlížečích je buď malá, nebo jsou nedoporučené a jejich vlastnosti budeme nastavovat pomocí CSS v další části semestru. Zmíním ale několik atributů, které jsou důležité, nebo využitelné.

Elemnt <td> může mít atribut colspan  s číslenou hodnotou, která udává, přes koli sloupců se buňka roztáhne. Standardně je přes jednu. Obdobnou funki má atribut rowspan, ale na řádky.

První řádek tabulky může být zvýrazněn a uveden jako záhlaví (hlavička). V takovém případě, se místo prvků td používají elementy th [table head]. Použití a atributy jsou u obou elementů stejné. Obsah prvků th bývý vystředěn a sázen tučným, případně větším písmem.

Element  table může obsahovat atribut border, označující sílu orámování buňěk v pixelech. Lze také orámovat celou tabulku a to atributem frame. Tan může obsahovat například hodnoty: "void"- bez rámečku, "border" všechny strany. Existují i varianty na orámovnání pouze nahoře či dole, nebo kombuinace.