Lekce na HTML. sloučení buněk

Tabulky v HTML - velmi šikovný položku. S nimi můžete dělat cokoliv. Samozřejmě, že hlavním účelem - umístění informace v tabulce. Ale vývojáři stránek jít dál. Najednou to bylo velmi populární používat tabulku vytvořit rámec webu. Nyní odborníci se snaží, aby tak učinily.

Tabulky našly široké uplatnění vzhledem k velkému počtu atributů. Například velmi užitečná vlastnost otočil kombinování řádků a sloupců.

Úvod do teorie

V HTML, odbor buněk dochází pomocí dvou atributů: colspan a RowSpan. Jsou určena pro td tagu.

Pojďme nejprve analyzovat strukturu každého stolu, než se ponořit do tématu. V každé tabulce je řádek, a v něm - buňka. Uvědomte si, že zpočátku, všechny tabulky musí obsahovat stejný počet buněk.

Na obrázku výše uvedených dvou řadách a v každé ze tří buněk. To je obyčejný stůl. Pokud jste v každém zadejte menší počet buněk se tabulka „vystěhovat“, to vše nebudou zobrazovat správně.

HTML Tabulka: sloučení buněk vertikálně a horizontálně

Chcete-li zadat menší počet buněk nebo řetězce mohou být použity pouze v případě, že máte něco sloučit. Ale místo toho, odstraněné položky v nejbližšího souseda na vrchol je třeba určit další atribut. Spojíme-li sloupce, pak colspan, pokud strunami, pak RowSpan. Hodnota atributu udává počet položek, které chcete sloučit.

Vezměte prosím na vědomí, že je třeba jej uvést v nejbližší prvek na vrchol. Například na obrázku výše, pokud jste chtěli spojit buňky 1 a 2, je třeba zadat v colspan atributu buňka 1 s hodnotou dvou. A odstranit pozici číslo 2 nebo 3, na tom nezáleží.

Pointa je, že řeknete buňky, kolik místa to bude trvat. Výchozí hodnota je 1.

Sloučit buňky vertikálně HTML-tabulky se koná na stejném principu. Jednoduše obsazený prostor, budou považovány za vertikálně. Viz níže uvedený obrázek.

Zde je buňka s číslem 43 má dva řetězce. Chcete-li to provést, zadat atribut RowSpan. Jen si vzpomněl:

• Řádek - řádek.
• Col - sloupec / sloupec.
• Span - Association.

Tvůrci se snažili přivést jazyk jak je to možné pro člověka, takže dokonce aniž by to věděli, mohlo nějak pochopit.

V HTML, odbor buněk může být provedeno ve dvou směrech: vertikálně i horizontálně. K tomu, abychom specifikovat oba atribut.

Na obrázku výše je právě to, a uvedl, že sdružení může dělat: řádky, sloupce, nebo oba řádky a sloupce.

HTML: sloučení buněk. příklady

Zvažme složitější příklady milník na rozsáhlých tabulek. Dole na levé straně se nachází původní verzi pravidelné tabulky. Právo - varianta s kombinací dvou buněk v druhé řadě. Tak přehlednější a snadněji porovnat HTML kód.

Můžete také kombinovat všechny tři v centru buňky. V prvním případě colspan atribut určuje buňku №1. Zde se poprvé bude beze změny, a druhá přidal k colspan, která se rovná třem.

Chcete-li sloučit všechny buňky v řadě na jednu, pak vyjměte čtyři TD v prvním ukazují colspan = ‚5‘.

Jak můžete vidět, ve skutečnosti je všechno jednoduché. Nic složitého. A co je nejdůležitější, opatrně, od prvního okamžiku porozumět všem nástrahám tabulek, a pak by neměl nastat žádný problém.

Tabulka jako rámec webu

V HTML, odbor buněk není vždy používá pro pravidelné tabulky s informacemi (v aplikaci Word nebo Excel). Webové stránky návrháři často, ale před tím, než průzkumy používali je pro rozvržení stránek.

Zvažte například rozvržení webu. Tento design - velmi jednoduché a primitivní. Ale můžete zobrazit využití asociace explicitně.

Původně zde byla tabulka ze tří řad dvěma buňkami každý. Poté, umístit logo místa, dvě buňky v první řadě byly sloučeny. Pointa je, aby učinili totéž, aby se přizpůsobila „suterénu“.

Vzhledem k jejím místě je možné umístit prvky designu, a nic nenechá své meze. Jedná se o velmi pohodlné a jednoduché. Proto to bylo tak populární. Nyní se doporučuje vytvořit tag div bloků.

závěr

A pamatujte si, že HTML tabulky buňka sloučení, můžete si dělat, co se vám líbí. To vše záleží na tom, co chcete a jak chcete, aby to zařídit. Důležité je, nenechte se zmást. Chcete-li vytvořit velké tabulky s velkým počtem asociací, doporučuje se kreslit to všechno na kus papíru nebo v programu Malování. Imposer začátečníci to bude jednodušší.

Když získají zkušenosti, tyto operace lze provádět ve vaší hlavě snadno.