0:00:00.279,0:00:04.335 Vytvořila jsem webovou stránku[br]o domácích mazlíčcích se seznamem jejich jmen. 0:00:04.335,0:00:06.747 Co vás napadne,[br]když se na to podíváte? 0:00:06.747,0:00:11.113 Měla jsem mazlíčky se jmény[br]Black & White, Deamon a Angel. 0:00:11.113,0:00:12.964 Co to bylo za mazlíčky? 0:00:12.964,0:00:14.553 Jakou měli barvu? 0:00:14.553,0:00:16.124 Jak staří byli? 0:00:16.124,0:00:19.233 Měla bych vám o nich[br]poskytnout více informací 0:00:19.233,0:00:21.047 abych ukojila vaši zvědavost. 0:00:21.047,0:00:23.457 Mohla bych to udělat[br]pomocí vnořeného seznamu 0:00:23.457,0:00:26.816 nebo dát informaci do kulatých závorek. 0:00:26.816,0:00:30.332 Black & White byl králík, 0:00:30.332,0:00:32.213 Daemon je kočka, 0:00:32.213,0:00:34.204 a Angel taky. 0:00:34.384,0:00:37.375 Ale tohle se mi nelíbí,[br]protože to není organizované 0:00:37.375,0:00:40.906 a na první pohled nevidím všechny druhy zvířat 0:00:40.906,0:00:42.786 v jednom hezky zarovnaném seznamu. 0:00:42.786,0:00:46.706 Tohle je perfektní příležitost[br]pro použití tabulky, 0:00:46.706,0:00:49.140 ve které bude řádek pro každého mazlíčka 0:00:49.140,0:00:51.858 a sloupec pro jejich jednotlivé vlastnosti, 0:00:51.858,0:00:54.084 které vám chci ukázat. 0:00:54.084,0:00:58.378 Pro vytvoření tabulky v HTML,[br]budeme potřebovat hodně tagů. 0:00:58.378,0:00:59.958 Tak se připravte. 0:00:59.958,0:01:02.771 A nelámejte si hlavu,[br]když si je nebudete všechny pamatovat. 0:01:02.771,0:01:04.434 Vždycky si je potom můžete najít. 0:01:04.434,0:01:08.460 Mně to třeba trvalo 10 let,[br]než jsem si je všechny zapamatovala. 0:01:08.460,0:01:10.436 Tak se dáme do toho. 0:01:10.436,0:01:15.084 První tag je , 0:01:15.084,0:01:17.560 Dále potřebujeme hlavičku tabulky, 0:01:17.560,0:01:20.023 která bude obsahovat popisek[br]pro každý sloupec. 0:01:20.023,0:01:23.043 Takže napíšeme . 0:01:23.043,0:01:27.858 Dovnitř obvykle chceme jen jeden řádek. 0:01:27.858,0:01:32.002 Pro každý řádek v tabulce[br]použijeme tag . 0:01:32.002,0:01:35.286 Do tohoto řádku chceme[br]buňky hlavičky. 0:01:35.286,0:01:41.677 Pro každou buňku hlavičky[br]napíšeme tag . 0:01:41.677,0:01:44.879 Jaký bude popisek prvního sloupce? 0:01:44.879,0:01:49.092 Budou to jména mazlíčků,[br]protože to je nejdůležitější údaj v řádku. 0:01:49.092,0:01:51.306 a zároveň je to jedinečný identifikátor. 0:01:51.306,0:01:54.699 Přidáme další sloupec pro druh zvířete. 0:01:54.699,0:01:58.602 A nakonec přidáme sloupec pro barvu. 0:01:58.602,0:02:01.532 Myslím, že to prozatím stačí. 0:02:01.532,0:02:03.915 Teď přidáme nějaká data. 0:02:03.915,0:02:05.951 Pro začátek vyplníme řádky daty 0:02:05.951,0:02:09.473 pomocí tagu pod 0:02:09.473,0:02:11.847 a pak budeme znovu[br]potřebovat vytvořit řádek, 0:02:11.847,0:02:14.282 takže použijeme tag . 0:02:14.282,0:02:16.717 Ale uvnitř místo tagu , 0:02:16.717,0:02:20.005 použijeme ,[br]protože jsme uvnitř těla tabulky. 0:02:20.005,0:02:23.136 'td' je zkratka pro 'Table Data', 0:02:23.136,0:02:27.871 Jaká je hodnota v první buňce[br]prvního řádku? 0:02:28.056,0:02:30.311 No, podívám se do mého seznamu, 0:02:30.311,0:02:33.801 a vidím, že první věc na něm[br]byla Black & white, 0:02:33.801,0:02:36.019 což je její jméno, 0:02:36.019,0:02:40.258 takže jenom napíšu "Black & white". 0:02:40.258,0:02:42.496 Teď druhý tag . 0:02:42.496,0:02:46.726 Druhý tag je pro druh zvířat. 0:02:46.726,0:02:49.724 a Black & white je králík, 0:02:49.724,0:02:52.497 takže napíšeme "králík". 0:02:52.497,0:02:55.159 A nakonec, třetí . 0:02:55.159,0:02:59.049 Koukneme nahoru,[br]třetí je pro barvy. 0:02:59.049,0:03:04.430 No, jako malá jsem nebyla moc kreativní,[br]když jsem pojmenovávala svého králíka, 0:03:04.430,0:03:08.215 takže barvy můžete nejspíš uhádnout. 0:03:08.215,0:03:10.767 Dobrá, pojďme na další řádek. 0:03:10.767,0:03:13.067 Ukážu vám malou fintu,[br]která se mi líbí. 0:03:13.067,0:03:15.544 Jakmile uděláme jeden řádek. 0:03:15.544,0:03:17.126 označíme ho 0:03:17.126,0:03:19.394 a zkopírujeme pomocí klávesové zkratky, 0:03:19.394,0:03:22.588 což je obvykle Control + C, 0:03:22.588,0:03:24.538 záleží na vašem operačním systému. 0:03:24.538,0:03:28.637 A poté to vložíme,[br]rovněž pomocí klávesové zkratky, 0:03:28.637,0:03:31.082 většinou control + V, 0:03:31.082,0:03:33.035 opět podle operačního systému. 0:03:33.035,0:03:36.870 A po vložení akorát změním hodnoty. 0:03:36.870,0:03:41.779 Takže tahle bude Daemon, [br]kočka a bude černá, 0:03:41.779,0:03:44.397 a pak to uděláme ještě jednou, 0:03:44.397,0:03:52.705 a tohle bude Angel,[br]kočka a bude oranžová. 0:03:52.705,0:03:58.158 Když byste měli pořád psát a ,[br]tak se unudíte k smrti. 0:03:58.158,0:04:03.292 Tenhle můj kopírovací trik[br]vám to trochu ulehčí. 0:04:03.299,0:04:05.853 A máme hotovou tabulku! 0:04:05.853,0:04:08.041 Můžu snadno přidat další sloupce, 0:04:08.041,0:04:10.548 pouze přidám další tag v hlavičce, 0:04:10.548,0:04:12.827 a pak v každém řádku, 0:04:12.827,0:04:16.142 pokud bych chtěla přidat[br]více detailů o mých mazlíčcích. 0:04:16.142,0:04:19.661 Možná vás zajímá,[br]jak změnit vzhled tabulky, 0:04:19.661,0:04:22.209 jako změnit okraje[br]nebo barvy nebo velikost mezer. 0:04:22.209,0:04:24.673 Vše můžete dělat pomocí CSS vlastností, 0:04:24.673,0:04:27.768 které jste se už možná naučili[br]nebo se naučíte. 0:04:27.768,0:04:31.462 Vyzkoušejte si vytvořit vlastní webovou[br]stránku se seznamem vlastních mazlíčků, 0:04:31.462,0:04:33.294 nebo mazlíčků, které byste chtěli. 0:04:33.294,0:04:35.853 A uspořádejte data do tabulky.