|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Menu
Distributions (131)
bootable [55]
commercial [7] no-commercial [42] unclassified [20] [7]
Software (10844)
|
HTML (10) - tabulky 3O 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.
Skupiny řádekU 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:
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ěkPokud 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 tabulkyU 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
Pro atribut rules="" jsou povolené tyto hodnoty
Šíř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".
Related article
HTML (1) HTML (2) - odstavec a nadpisy HTML (3) - styly písma HTML (4) - odkazy HTML (5) - obrázky HTML (6) - obrázky 2 HTML (7) - seznamy HTML (8) - tabulky HTML (9) - tabulky 2 HTML (11) - formuláře HTML (12) - formuláře 2 HTML (13) - formuláře 3 HTML (14) - formuláře 4 HTML (15) - formuláře 5 HTML (16) - rámy HTML (17) - rámy 2 HTML (18) - rámy 3 HTML (19) - metadata HTML (20) - dokončujeme Webové Standardy 1 - Historie, problém a řešení HTML (21) - Přecházíme na XHTML Dynamické načítání dat z databáze pomocí jQuery a PHP Programujeme chat s dynamickým načítáním HTML 5 I. - Úvod do HTML 5 HTML 5 II. - Ako začať s tvorbou HTML 5 dokumentu Previous Show category (serial) Next
|
Szukanie oprogramowania
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
©Pavel Kysilka - 2003-2024 | maillinuxsoft.cz | Design: www.megadesign.cz |