Čiže tabuľka sa skladá z riadkov, ktoré sú rozdelené na bunky (priehradky), čím vytvárame stĺpce. No na začiatok to ani veľmi nebolelo, a preto sa presuniem k základom práce s tabuľkou v HTML kóde.
Základ tabuľky:
TAGY | POPIS | ATRIBÚTY |
---|---|---|
<table></table> | Týmito párovými tagmi musíme oddeliť celú tabuľku od zvyšného textu, na blogu treba dať týmto tagom aj atribút class="txt" pretože ináč sa tabuľka nezobrazí správne (v najlepšom prípade nebudú ladiť farby) | Tých je mnoho, a preto Vám odporúčam si radšej pozrieť w3schools |
<tr></tr> | Definuje jeden riadok v tabuľke (!!!nie jednu bunku!!!) |
Tu sú použiteľné atribúty, ktoré menia: pozadie - bgcolor; zarovnanie - align |
<td></td> | Definuje jednu bunku v riadku, čiže tanto tag musí byť začatý aj ukončený medzi tagmi <tr> a </tr>. V podstate je dobré si už pred začatím uvedomiť, koľko stĺpcov potrebujete a tomu aj prispôsobiť počet buniek na riadok. | Prakticky to isté, ako pri <tr> ale je tu aj atribut width="", ktorý definuje šírku bunky. |
<th></th> | Takisto, ako <th> definuje jednu bunku v riadku, ale jej text je nejako špecialne formátovaný (najčastejšie hrubším písmom), tak ako Dmiba napísal v komentári, je to table header čiže hlavička tabuľky, ale môžete ju prakticky dať kamkoľvek v rámci tabuľky. Ináč platí to osté, ako o <td> | To isté, ako pri <td> |
Príklad:
<table class="txt" width="50%" summary="Skúšobná tabuľka" align="left">
<tr>
<th width="30%">
Hlavička A
</th>
<th>
Hlavička B
</th>
</tr>
<tr>
<td>
Bunka číslo 1a
</td>
<td>
Bunka číslo 1b
</td>
</tr>
<tr>
<td>
Bunka číslo 2a
</td>
<td>
Bunka číslo 2b
</td>
</tr>
</table>
Hlavička A | Hlavička B |
---|---|
Bunka číslo 1a | Bunka číslo 1b |
Bunka číslo 2a | Bunka číslo 2b |
P.S. Snažil som sa túto náročnú tému, čo najviac zjednodušiť, a preto som robil mnoho škrtov, aby som nepísal zbytočne veľa atribútov, ktoré by boli pre začiatočníka aj tak zbytočné a dúfam, že ma za to pokročilí neukameňujú.
P.S.S. Nevenoval som sa veľmi vizuálnej stránke tabuľky, pretože je to téma sama o sebe, a ak bude ohlas kladný tak sa jej trošku povenujem v ďalšom diely tohto seriálu.
Komentáre
no skus este pridat podstatnu zalezitost
cize table head, to sa obcas hodi ;)
OK