Dal╣φ mo╛nosti tabulek

Ve ΦtvtΘ verzi HTML se objevily n∞kterΘ novΘ zp∙soby vykreslovßnφ tabulek, kterΘ jsou mßlo znßmΘ. Dne╣nφ prohlφ╛eΦe (jaro 2003) je podporujφ dob°e, akorßt Mozilla neumφ frame a rules (test na verzi 0.9.3)..

Vykreslovßnφ m°φ╛ky frame a rules - Formßtovßnφ sloupc∙ - Skupiny °ßdk∙ - Co nefunguje

Vykreslovßnφ m°φ╛ky - FRAME a RULES

M°φ╛ka a rßmeΦek se kolem bun∞k tabulky normßln∞ vykreslujφ. NovΘ atributy frame a rules umo╛≥ujφ p°edepsat, ╛e n∞kterΘ Φßry (nap°. Φßry mezi sloupeΦky) se vykreslovat nebudou. Atribut FRAME p°itom kontroluje zobrazenφ vn∞j╣φho okraje tabulky, RULES popisujφ zobrazovßnφ vnit°nφch Φar.

Frame - vykreslenφ rßmeΦku

Jako hodnotu atributu frame m∙╛u zadat n∞kolik hodnot:

Aby to fungovalo, musφm navφc zadat nenulovou ╣φ°ku okraje (border), jinak se nezobrazφ nic. P°φklad:

<table border="2" cellpadding="6" cellspacing="0" width="90%" frame="hsides">

Tato tabulka by nem∞la mφt zobrazen prav² a lev² okraj.

Rules - vykreslenφ m°φ╛ky

Atribut RULES se pou╛φvß ·pln∞ stejn∞ jako FRAME. P°esto╛e mß mΘn∞ mo╛n²ch hodnot, p°ipadß mi vyu╛iteln∞j╣φ:

Kup°φkladu ukß╛u, jak tato tabulka zaΦφnala:

<table border="2" cellpadding="6" cellspacing="0" width="90%" frame="vsides" rules="rows">

Tato tabulka by mem∞la mφt zobrazen hornφ a spodnφ rßmeΦek a m°φ╛ku by m∞la mφt pouze mezi °ßdky. Op∞t je nutnΘ mφt nenulov² atribut border, jinak se samoz°ejm∞ nevykreslφ v∙bec nic.

Pokud se vßm nezobrazily efekty, kterΘ popisuji, patrn∞ pou╛φvßte prohlφ╛eΦ, kter² je nepodporuje. Z toho mimo jinΘ vypl²vß, ╛e se na tyto efekty nikdy nem∙╛ete spolehnout. Na╣t∞stφ jde o takovou jenom lib∙stku, jejφ╛ nefunkΦnost zase tak nebolφ.

Formßtovßnφ sloupc∙ - <col>

Kdo n∞kdy ruΦn∞ zadßval ╣φ°ky a zarovnßnφ bun∞k v n∞jakΘ v∞t╣φ tabulce, asi mu vadilo, jak je to pracnΘ. P°itom v ka╛dΘm sloupeΦku se zadßvajφ v╣em bu≥kßm stejnΘ hodnoty! Trochu nßm situaci usnadnily wysiwyg editory, kterΘ tam ty atributy (width="236" align="center" t°eba) doplnily automaticky, ale stejn∞ je pak ten k≤d p°φli╣ "nafouknut²". ╚as dozrßl na jednoduchΘ formßtovßnφ sloupc∙. Jsou na to novΘ tagy <col> a <colgroup> (ten jenom oΦas). P°φklad:

Tabulka mß tento k≤d:

<table border="2" cellpadding="6" cellspacing="0" width="300">
<col align="left" width="20">
<col align="center">
<col align="right">
<tr> <td>A</td> <td>B</td> <td>C</td> </tr>
<tr> <td>D</td> <td>E</td> <td>F</td> </tr>
</table>

 Krßtk² popis: tagy <col> se dßvajφ hned za tag <table> a m∞lo by jich b²t tolik, kolik je sloupc∙. Ka╛d² jeden tag popisuje formßtovßnφ jednoho sloupce. Pou╛itelnΘ atributy u <col> jsou ╣φ°ka width, align, bgcolor, valign a style. Mo╛nß by fungovaly i jinΘ, ale na to se nelze spolehnout. ⌐φ°ku lze krom∞ pixel∙ (zßpis bez jednotky) a procent zadßvat tΘ╛ v nßsobku: nap°. sloupec <col width="3*"> bude z p°φpadnΘho zbylΘho mφsta nßrokovat 3 dφly pro sebe (z celkovΘho souΦtu dφl∙ nßrokovan²ch v╣emi sloupci). 

Pokud se mß t°eba p∞t sousednφch sloupc∙ formßtovat stejn∞, je mo╛nΘ u <col> pou╛φt atribut span: <col span="5" align="right">.

Namφsto tagu <col> je mo╛no pou╛φt tag <colgroup>. (Dokonce by se to sprßvn∞ m∞lo d∞lat v╛dy.) Jedin² rozdφl spoΦφvß ve vykreslovßnφ m°φ╛ky, pokud u tabulky pou╛iji atribut rules="groups". (Dal╣φ teoretick² rozdφl je v tom, ╛e za tag <colgroups> se dajφ vno°ovat <col>.)

Skupiny °ßdk∙

Existujφ pßrovΘ tagy: <tbody>, <thead> a <tfoot>. Mohou se jimi logicky odd∞lovat °ßdky, kterΘ pat°φ k sob∞. Hlavbnφ uplatn∞nφ to mß p°i vykreslovßnφ m°φ╛ky. V budoucnosti se takto budou pravd∞podobn∞ vymezovat hlaviΦky a patiΦky, kterΘ se budou tisknout na ka╛dΘ strßnce nebo budou p°i rolovßnφ z∙stßvat na obrazovce. Nic z toho ale dne╣nφ prohlφ╛eΦe nepodporujφ (aktualizovßno 2003). Jedin² viditeln² efekt d∞lß <tfoot>: vykresluje skupinu °ßdk∙ na konci tabulky, i kdy╛ je uveden na zaΦßtku (IE 5+), m∙╛e to b²t kontraproduktivnφ.

Shrnujφcφ p°φklad

Tato tabulka se v HTML zapφ╣e takto:

<table border="2" cellpadding="6" cellspacing="0" rules="groups">
  <colgroup span="2" align="center" valign="bottom" width="40">
  <colgroup bgcolor="#00FFFF">
<thead>
  <tr><td>╚aj</td><td>Druh</td><td>Nßzor</td></tr>
</thead>
<tbody bgcolor="red" align="right">
  <tr><td>lipov²</td><td>bylinky</td><td>sla∩ouΦk²</td></tr>
  <tr><td>t°ezalky</td><td>bylinky</td><td>na spanφ</td></tr>
</tbody>
<tbody>
  <tr><td>Cherry tea</td><td>Φern² s ovocnou v∙nφ</td><td>nic moc</td></tr>
  <tr><td>⌐φpkov²</td><td>vlastn∞ ovocn²</td><td>jedin∞ s cukrem</td></tr>
</tbody>
<tfoot>
  <tr><td>znßm je╣t∞ dal╣φ</td><td>r∙zn²ch druh∙</td><td>p°ij∩te popφt</td></tr>
</tfoot>
</table>

PoprvΘ jsme si zkusili vykreslovßnφ m°φ╛ky po oddφlech (rules="groups"). Opravdu d∙le╛itou v∞cφ je spojenφ dvou prvnφch sloupc∙ do jednΘ skupiny atributem span="2". Za pozornost stojφ vertikßlnφ zarovnßnφ na spodek (normßln∞ je na st°ed) u prvnφho a druhΘho sloupce a barva pozadφ sloupce t°etφho. Dßle atributy tagu <tbody>, kterΘ tak zformßtujφ n∞kolik °ßdk∙ najednou (kdyby se to dalo k <tr>, tak to ovlivnφ jen jeden °ßdek). U bun∞k "sla∩ouΦk²" a "na spanφ" si v╣im∞te, ╛e barva pozadφ je p°evzata z <tbody> a nikoliv z <colgroup>.

Co nefunguje

V p°φruΦkßch a textech o HTML se objevujφ n∞kterΘ novΘ mo╛nosti formßtovßnφ tabulek, kterΘ jsou sice v norm∞ HTML, ale prost∞ nikde nefungujφ. Jednß se o:

• Zobrazovßnφ patiΦky automaticky na konci tabulky
• Zarovnßnφ sloupce na znak desetinnΘ Φßrky: <col align="charoff" char=",">

Dal╣φ: Design pomocφ tabulek P°edchozφ: Formßtovßnφ tabulek
Vizte tΘ╛: Zßklady tabulek
Odkaz mimo: Tabulky v HTML 4 (Sova v sφti)