Nakonec si ukážeme vytvoření složitější tabulky v HTML. Výsledné zobrazení v prohlížeči si můžeme prohlédnout na obrázku 22 – „Zobrazení složitější tabulky“.
<table border="1"> <caption align="bottom">Analýza prodeje</caption> <tr><th rowspan="2">Měsíc</th><th colspan="2">Prodej zboží</th></tr> <tr> <th>A</th> <th>B</th></tr> <tr align="center"><td>Leden</td> <td>865</td> <td>16</td></tr> <tr align="center"><td>Únor</td> <td>917</td> <td>8</td></tr> <tr align="center"><td>Březen</td><td>1036</td><td>18</td></tr> <tr valign="bottom"> <td> <table> <tr><th height="200">Shrnutí</th></tr> <tr><th><hr></th></tr> <tr><th valign="top" height="50">Závěr</th></tr> </table> </td> <td width="150"> <table width="100%"> <tr><td align="center" height="200">V případě zboží A vidíme poměrně rychlý nárůst obratu zvláště v březnu. Zdá se, že to bude tím, že se v tu dobu oteplilo.</td></tr> <tr><th><hr></th></tr> <tr><th valign="top" height="50">Ponechat a dále sledovat vývoj.</th></tr> </table> </td> <td width="150"> <table width="100%"> <tr><td align="center" height="200">Pokud jde o zboží B, je to mizerné.</td></tr> <tr><th><hr></th></tr> <tr><th valign="top" height="50">Zrušit výrobu</th></tr> </table> </td> </tr> </table>
Ač tabulka vypadá celkem pěkně, není její zápis v HTML
úplně čistý. Některé rozměry jsou v tabulce nastaveny natvrdo
(height="50", height="200")
a tabulka kvůli tomu není zcela nezávislá na výstupním
zařízení. Takovým věcem se občas nevyhneme, ale měli bychom je
používat co nejméně.
Praktické využití novinek, které nový model tabulek přináší, si ukážeme na příkladě. Výsledné zobrazení v prohlížeči přináší obrázek 23 – „Ukázka zformátované tabulky“.
<table frame="hsides" rules="groups" cellpadding="2"> <caption>Formáty papíru podle ČSN 50 0040</caption> <colgroup> <col align="left"> <col align="char" char="×" charoff="50%"></colgroup> <colgroup> <col align="left"> <col align="char" char="×" charoff="50%"></colgroup> <colgroup> <col align="left"> <col align="char" char="×" charoff="50%"></colgroup> <thead> <tr><th colspan="2" align="center">Základní řada</th> <th colspan="4" align="center">Doplňkové řady</th></tr> </thead> <tbody> <tr><th>A</th><td align="center">čisté rozměry v mm</td> <th>B</th><td align="center">čisté rozměry v mm</td> <th>C</th><td align="center">čisté rozměry v mm</td></tr> </tbody> <tbody> <tr><td>A0</td><td>841 × 1189</td> <td>B0</td><td>1000 × 1414</td> <td>C0</td><td>917 × 1297</td></tr> <tr><td>A1</td><td>594 × 841</td> <td>B1</td><td>707 × 1000</td> <td>C1</td><td>648 × 917</td></tr> <tr><td>A2</td><td>420 × 594</td> <td>B2</td><td>500 × 707</td> <td>C2</td><td>458 × 648</td></tr> <tr><td>A3</td><td>297 × 420</td> <td>B3</td><td>353 × 500</td> <td>C3</td><td>324 × 458</td></tr> <tr><td>A4</td><td>210 × 297</td> <td>B4</td><td>250 × 353</td> <td>C4</td><td>229 × 324</td></tr> <tr><td>A5</td><td>148 × 210</td> <td>B5</td><td>176 × 250</td> <td>C5</td><td>162 × 229</td></tr> <tr><td>A6</td><td>105 × 148</td> <td>B6</td><td>125 × 176</td> <td>C6</td><td>114 × 162</td></tr> <tr><td>A7</td><td>74 × 105</td> <td>B7</td><td>88 × 125</td> <td>C7</td><td>81 × 114</td></tr> <tr><td>A8</td><td>52 × 74</td> <td>B8</td><td>62 × 88</td> <td>C8</td><td>57 × 81</td></tr> <tr><td>A9</td><td>37 × 52</td> <td>B9</td><td>44 × 31</td> <td>C9</td><td>40 × 57</td></tr> <tr><td>A10</td><td>26 × 37</td> <td>B10</td><td>31 × 44</td> <td>C10</td><td>28 × 40</td></tr> </tbody> </table>
