LINUXSOFT.cz Přeskoč levou lištu
Uživatel: Heslo:  
   CZUKPL

> HTML (10) - tabulky 3

O tabulkách jsme se dozvěděli už téměř všechno. Tagy a atributy, které se běžně používají známe, ale kromě nich existují i další méně známé, které sice tak často nevyužijeme, ale pokud potřebujeme dosáhnout například nějakého speciálního orámování, mohou nám velice usnadnit práci.

12.8.2004 15:00 | Pavel Kácha | Články autora | přečteno 25554×

Skupiny řádek

U tabulek můžete definovat tři jejich důležité části: záhlaví, tělo a patu tabulky. Tyto tři části mají význam hlavně u dlouhých tabulek, které by měly být nějak přehledně zobrazeny: prohlížeč může nechat zobrazené záhlaví a zápatí na místě a posouvat jen tělo tabulky, při tisku se může opakovat záhlaví a zápatí na každé stránce. Jistě by se našly i nějaké další možnosti.

Záhlaví definujeme pomocí párového tagu <thead></thead>, pro tělo tabulky je připraven párový tag <tbody></tbody> a pro zápatí máme připravený opět párový tag <tfoot></tfoot>. Ukončovací tag není povinný, ale je lepší ho použít. Obsahem elementů jsou jednotlivé řádky tabulky, které chcete zařadit do skupiny řádek. Všechny tyto tři tagy mají kromě atributů, které jsou definovné pro všechny elementy HTML (id, class, lang, dir, title, style, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup) povolené i atributy align="", char="", charoff="", valign="".

O atributech align="", char="" a valign="" jsme si již povídali a jejich význam je při tomto použití totožný, proto se zmíním jen o novém atributu charoff="". Pomocí tohoto atributu můžete určit, kde se má zobrazit znak, ke kterému zarovnáváte data v tabulce (funguje samozřejmě jen při použití těchto atributů align="char" char=","). Jako hodnota atributu se udává vzdálenost od levého okraje buňky, můžete ji vyjádřit v pixelech nebo v procentech. Takže například chceme, aby se zarovnávající znak zobrazil uprostřed tabulky: stačí napsat charoff="50%". Atribut charoff="" můžete použít u následkujících elementů: <td>, <th>, <col> (viz níže), <colgroup> (viz níže), <tr><thead>, <tbody>, <tfoot>.

Při použití elementů <thead>, <tbody>, <tfoot> si musíte pamatovat tři důležitá pravidla:

  1. Každá použitá skupina řádek musí obsahovat alespoň jeden řádek tabulky. U záhlaví a zápatí je vhodnější použít pro jednotlivé buňky místo <td> element <th>
  2. Pokud tyto elemety (<thead>, <tbody>, <tfoot>) používáte musí být uvedeny ještě před definicí řádků tabulky.
  3. Záleží na pořadí elementů <thead>, <tbody>, <tfoot> v dokumentu. V tabulce musí být nejdříve definice záhlaví, potom zápatí a nakonec samotné tělo buňky, které ale můžete rozdělit pomocí několika elementů <tbody> na více logických částí.

Skupiny sloupců

Nemusíte slučovat do skupin jenom řádky, slučovat se dají i sloupce. Dá se to využít nejen pro zajímavější orámování tabulky, jak si řekneme později, ale hlavně je to dobré pro prohlížeč, který nemusí čekat na všechna data, aby rozhodl, jak budou sloupce široké - nemusí tedy při vykreslování tabulky několikrát přeformátovat celou stránku.

Skupiny sloupců definujeme pomocí párového tagu <colgroup></colgroup>, ukončovací tag není povinný. Kromě atributů, které jsou definované pro všechny elementy, můžeme použít i atributy align="", char="", charoff="", valign="". A navíc existují i dva speciální: span="" a width="". Pomocí span="" určujemejeme kolik sloupců má mít právě definovaná skupina sloupců, jejich šířku nastavíme atributem width="". Jako hodnotu atributu width="" můžeme použít buď vyjádření pomocí procent, pixelů nebo speciální hodnotu 0*, která prohlížeči říká, že sloupec má mít takovou minimální šířku, aby se do něj vešel obsah buněk.

Sloupce nemusíte definovat jen v elementu <colgroup>, můžete použít i jiný způsob zápisu pomocí nepárových tagů <col>. Jejich atributem je width="" a jako hodnotu můžete nastavit šířku v pixelech procentech nebo speciální hodnotu n*, kde n je libovolné celé číslo od nuly až po libovolně vysoké číslo, zbývající místo se potom rozdělí v poměru čísel n mezi jednotlivé sloupce. Výraz 0* má stejný význam jako u elementu <colgroup>.

Můžeme použít i altribut span="", kterým můžeme najednou definovat několik buněk. Počet buněk zadáme jako jeho hodnotu.

Jeden malý příklad: Chceme definovat tři sloupce: první dva o šířce 20 pixelů a třetí o minimální šířce pro obsah buňky.

<colgroup>
  <col width="20" span="2">
  <col width="0*">
</colgroup>

Pojmenování buněk

Pokud budou naše tabulky převáděné do mluvené řeči, je dobré nějak lépe označit. K tomu slouží atributy axel="" a axis="", které můžete použít ve všech buňkách: tedy v elementech <td> a <th>. Hodnotou atributu axis="" je jméno buňky, pokud ho nepoužijete je jméno buňky shodné s jejím obsahem.

Hodnotou atributu axes="" je seznam jmen axis="" buněk, ke kterým se obsah buňky váže.

Zobrazení mřížky a rámečku tabulky

U elementu <table> můžete použít atribut frame="" pro změnu vykreslování rámečku tabulky nebo atribut rules="" pro změnu vykreslování mřížky.

Pro atribut frame="" jsou povolené tyto hodnoty

Hodnota Význam
void tabulka je bez rámečku. Tato volba je výchozí.
above rámeček je pouze na horní hraně tabulky
below rámeček je pouze na spodní hraně tabulky
hsides rámeček je pouze na dolní a spodní hraně tabulky
vsides rámeček je pouze na levé a pravé hraně tabulky
lhs rámeček je pouze na levé hraně tabulky
rhs rámeček je pouze na pravé hraně tabulky
box rámeček je okolo celé tabulky
border rámeček je okolo celé tabulky

Pro atribut rules="" jsou povolené tyto hodnoty

Hodnota Význam
none tabulka je bez mřížky. Tato volba je výchozí.
groups mřížka je pouze mezi skupinami řádek a skupinami sloupců
rows mřížka je pouze mezi řádky tabulky
cols mřížka je pouze mezi sloupci tabulky
all mřížka je mezi všemi buňkami tabulky

Šířku rámečku a mřížky nastavíte atributem border="", pokud ho nastavíte na nulu a nepoužijete rules="", frame="" bude tabulka bez mřížky a rámečku. Pokud nastavíte nenulovou hodnotu bez použití rules="", frame="", bude tabulka formátovaná jako byste nastavili frame="border" rules="all".

Verze pro tisk

pridej.cz

 

DISKUZE

Nejsou žádné diskuzní příspěvky u dané položky.



Příspívat do diskuze mohou pouze registrovaní uživatelé.
> Vyhledávání software
> Vyhledávání článků

28.11.2018 23:56 /František Kučera

Prosincový sraz spolku OpenAlt se koná ve středu 5.12.2018 od 16:00 na adrese Zikova 1903/4, Praha 6. Tentokrát navštívíme organizaci CESNET. Na programu jsou dvě přednášky: Distribuované úložiště Ceph (Michal Strnad) a Plně šifrovaný disk na moderním systému (Ondřej Caletka). Následně se přesuneme do některé z nedalekých restaurací, kde budeme pokračovat v diskusi.


Komentářů: 1

12.11.2018 21:28 /Redakce Linuxsoft.cz
22. listopadu 2018 se koná v Praze na Karlově náměstí již pátý ročník konference s tématem Datová centra pro business, která nabídne odpovědi na aktuální a často řešené otázky: Jaké jsou aktuální trendy v oblasti datových center a jak je optimálně využít pro vlastní prospěch? Jak si zajistit odpovídající služby datových center? Podle jakých kritérií vybírat dodavatele služeb? Jak volit vhodné součásti infrastruktury při budování či rozšiřování vlastního datového centra? Jak efektivně datové centrum spravovat? Jak co nejlépe eliminovat možná rizika? apod. Příznivci LinuxSoftu mohou při registraci uplatnit kód LIN350, který jim přinese zvýhodněné vstupné s 50% slevou.
Přidat komentář

6.11.2018 2:04 /František Kučera
Říjnový pražský sraz spolku OpenAlt se koná v listopadu – již tento čtvrtek – 8. 11. 2018 od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5). Tentokrát bez oficiální přednášky, ale zato s dobrým jídlem a pivem – volná diskuse na téma umění a technologie, IoT, CNC, svobodný software, hardware a další hračky.
Přidat komentář

4.10.2018 21:30 /Ondřej Čečák
LinuxDays 2018 již tento víkend, registrace je otevřená.
Přidat komentář

18.9.2018 23:30 /František Kučera
Zářijový pražský sraz spolku OpenAlt se koná již tento čtvrtek – 20. 9. 2018 od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5). Tentokrát bez oficiální přednášky, ale zato s dobrým jídlem a pivem – volná diskuse na téma IoT, CNC, svobodný software, hardware a další hračky.
Přidat komentář

9.9.2018 14:15 /Redakce Linuxsoft.cz
20.9.2018 proběhne v pražském Kongresovém centru Vavruška konference Mobilní řešení pro business. Návštěvníci si vyslechnou mimo jiné přednášky na témata: Nejdůležitější aktuální trendy v oblasti mobilních technologií, správa a zabezpečení mobilních zařízení ve firmách, jak mobilně přistupovat k informačnímu systému firmy, kdy se vyplatí používat odolná mobilní zařízení nebo jak zabezpečit mobilní komunikaci.
Přidat komentář

12.8.2018 16:58 /František Kučera
Srpnový pražský sraz spolku OpenAlt se koná ve čtvrtek – 16. 8. 2018 od 19:00 v Kavárně Ideál (Sázavská 30, Praha), kde máme rezervovaný salonek. Tentokrát jsou tématem srazu databáze prezentaci svého projektu si pro nás připravil Standa Dzik. Dále bude prostor, abychom probrali nápady na využití IoT a sítě The Things Network, případně další témata.
Přidat komentář

16.7.2018 1:05 /František Kučera
Červencový pražský sraz spolku OpenAlt se koná již tento čtvrtek – 19. 7. 2018 od 18:00 v Kavárně Ideál (Sázavská 30, Praha), kde máme rezervovaný salonek. Tentokrát bude přednáška na téma: automatizační nástroj Ansible, kterou si připravil Martin Vicián.
Přidat komentář

   Více ...   Přidat zprávičku

> Poslední diskuze

2.12.2018 23:56 / František Kučera
Sraz

5.10.2018 17:12 / Jakub Kuljovsky
Re: Jaký kurz a software by jste doporučili pro začínajcího kodéra?

20.9.2018 10:04 / Jan Ober
Jaký kurz a software by jste doporučili pro začínajcího kodéra?

20.9.2018 10:00 / Jan Ober
Re: Gimp

20.2.2018 18:48 / Ivan Majer
portal

Více ...

ISSN 1801-3805 | Provozovatel: Pavel Kysilka, IČ: 72868490 (2003-2018) | mail at linuxsoft dot cz | Design: www.megadesign.cz | Textová verze