MENU

<td> ... </td> ohraničení obsahu buňky uvnitř řádku tabulky

Značka <td> ohraničuje obsah buňky uvnitř řádku. Buňka může obsahovat texty, obrázky, odkazy atd.

Ukázka tabulky v HTML

  <table>
<tbody>
<tr>
<td>Obsah první buňky</td>
<td>Obsah druhé buňky</td>
</tr>
</tbody>
</table>  

Vysvětlení dalších značek v tabulce

Slučování buněk pomocí clospan

Pokud potřebujete sloučit dohromady 2 a více buněk tabulky v HTML, tak se k tomu používá atribut clospan. Do číslovky uvedete jen počet buněk, které sloučí.

Ukázka sloučení buněk v HTML

  <table>
<tbody>
<tr>
<td clospan="2">Obsah sloučených buněk</td>
</tr>
<tr>
<td>Obsah nesloučených buněk</td>
<td>Obsah nesloučených buněk</td>
</tr>
</tbody>
</table>  

Šířka buněk

Buňky v tabulce HTML se standardně snaží přizpůsobit se velikosti obsahu umístěného do <td> (to platí za situace, pokud velikost buňky nedefinujete). Ostatní buňky ve sloupci (např. první buňky) budou mít stejnou šířku, jakou má největší buňka, aby šířka sloupce byla jednotná pro danou tabulku.

Jak určit šířku buněk

Pokud z nějakého důvodu chcete definovat šířku sloupce, tak máte několik možností:

Určit přesnou šířku sloupce přímo do HTML

  <table>
<tbody>
<tr>
<td width="50">Obsah první buňky</td>
<td>Obsah druhé buňky</td>
</tr>
</tbody>
</table>  

Toto řešení je snadné a činné. Potíž je v tom, že vám dovoluje nastavit jen přesný rozměr. Číslovka, která je tam uvedena znamená počet pixelů a přesně tuto šířku bude celý sloupec mít. Někdy ovšem potřebuje jiné řešení, které je popsáno níže.

Určení šířky pomocí CSS

Pokud se rozhodnete určit šířku pomocí zápisu v CSS, tak získáte více možností. Ideálním řešením je přidělení ID nebo CLASS dané buňce a zápis stylů CSS do externího souboru. Pokud to ale není možné nebo nevíte co to je externí CSS soubor, tak můžete provést zápis i přímo do HTML s tím, že to sice funguje, ale není to správné řešení v případě zkušeného kodéra.

V případě zápisu CSS můžete používat hodnotu jak v pixelech (px), tak třeba i v procentech (%). 

Maximální šířka sloupce

  <table>
<tbody>
<tr>
<td style="max-width: 200px">Obsah první buňky</td>
<td style="max-width: 50%">Obsah druhé buňky</td>
</tr>
</tbody>
</table>  

Minimální šířka sloupců

Píše se obdobně, ale jen s tím rozdílem, že napíšete min-width.

Kam dál

Kurz základy HTML a CSS | Kurz tvorby webových stránek pomocí systému Joomla | Kurz Základy SEO

Potřebujete pomoci? Žádný problém!

Nevíte si s něčím rady a potřebujete rychlou pomoc odborníka? Můžete se obrátit na nás a my vám dokážeme pomoci i přes internet.

Více o on-line pomoci přes internet se dozvíte zde:

On-line pomoc

Pokud nevíte, neváhejte se zeptat

© HelpMark | Tomáš Herout | Tel: +420 739 719 548