Bootstrap
HTML a CSS
Bootstrap
English version
Lekce 1 - Úvod do CSS frameworku Bootstrap
Úvod do nejpopulárnějšího CSS frameworku vysvětlí proč bychom měli frameworky používat, vytvoříme první stránku a řekneme si kde najít šablony zdarma.
Lekce 2 - Bootstrap - Reboot
V tutoriálu si popíšeme jak Reboot resetuje výchozí CSS styly a jaké konvence bychom měli při práci s CSS frameworkem Bootstrap dodržovat.
Lekce 3 - Bootstrap - Typografie
V tutoriálu si zmíníme první Bootstrap třídy, kterými explicitně stylujeme nadpisy a podnadpisy, citace, zkratky a seznamy. Seznámíme se s utility třídami.
Lekce 4 - Bootstrap - Obrázky
V tutoriálu si detailně popíšeme stylování obrázků pomocí CSS frameworku Bootstrap včetně responzivity, rámečků, obtékání, centrování a popisků.
Lekce 5 - Bootstrap - Tabulky
V CSS tutoriálu si popíšeme jak stylovat tabulky pomocí tříd frameworku Bootstrap, ukážeme si rámečky, pruhování, barvy a responzivní styly.
Lekce 6 - Bootstrap - Tlačítka
Tutoriál CSS frameworku Bootstrap o tlačítkách (buttons). Obrysy, různé velikosti a barvy, neaktivní tlačítka, dropdowns, vypínače, skupiny a další.
Lekce 7 - Bootstrap - Formuláře
Stylování formulářů a všech formulářových prvků objasní tento tutoriál CSS frameworku Bootstrap. Ukážeme si i použití gridu nebo vložení formů do řádku.
Lekce 8 - Bootstrap - Další možnosti formulářů
V CSS tutoriálu se naučíme jak v Bootstrapu na vlastní klientské validace formulářů, vlastní styly checkboxů, selectů a radiobuttonů a skupiny inputů.
Lekce 9 - Bootstrap - Jumbotron a Badges
Bootstrap tutoriál představí komponentu Jumbotron a používání štítků/tagů/odznaků badges v HTML nadpisech a tlačítkách.
Lekce 10 - Bootstrap - List groups
V tutoriálu CSS frameworku Bootstrap představíme list groups, seznamové skupiny a jak se používají s odkazy, tlačítky, odznaky a taby.
Lekce 11 - Bootstrap - Karty
Karty slouží v CSS frameworku Bootstrap jako univerzální kontejnery. Tutoriál předvádí různá použití jako produktu e-shopu, obrázkového pozadí nebo zdí.
Lekce 12 - Bootstrap - Carousely a Progress
V tutoriálu si představíme komponenty CSS frameworku Bootstrap Carousel pro animování slajdů a Progress pro zobrazení indikátorů postupu.
Lekce 13 - Bootstrap - Collapse a Accordion
Sbalovací/rozbalovací obsah komponent Collapse a harmoniky Accordion popisuje podrobný tutoriál CSS frameworku Bootstrap.0
Lekce 14 - Bootstrap - Dropdowns
V tutoriálu si popíšeme rozbalovací tlačítka, která jsou v CSS frameworku Bootstrap reprezentována jako komponenta Dropdown.
Lekce 15 - Bootstrap - Navigace
V tutoriálu se naučíme stylovat navigaci a to včetně dynamických záložek v CSS frameworku Bootstrap.
Lekce 16 - Bootstrap - Navigační lišta
CSS tutoriál navazuje na předchozí lekci o navigaci a předvádí jak napsat responzivní navigační lištu v CSS frameworku Bootstrap.
Lekce 17 - Bootstrap - Paginace, Upozornění a Drobečková navigace
Komponenty Pagination, Alerts a Breadcrumb si podrobně popíšeme v dalším tutoriálu o populárním CSS frameworku Bootstrap.
Lekce 18 - Bootstrap - Modální dialogy
V tutoriálu Bootstrap CSS frameworku si ukážeme jak vkládat modální dialogy, jak předvyplňovat jejich data a také jak je ovládat přímo z JavaScriptu.
Lekce 19 - Bootstrap - Popovers
V CSS frameworku Bootstrap se v tomto tutoriálu naučíme používat tzv. Popovers, které byly přejaty z iOS a fungují jako informační bubliny.
Lekce 20 - Bootstrap - Scrollspy
Bootstrap Skrolovací špion umožňuje automaticky přepínat aktivní tlačítka na navigaci podle toho v jaké části stránky se nacházíme.
Lekce 21 - Bootstrap - Tooltipy
Tooltipy, jejich inicializace a ovládání JavaScriptem, to je to, co se naučíte v tomto tutoriálu CSS frameworku Bootstrap.
Lekce 22 - Bootstrap - Utilities
Display, responzivní videa s dodržením poměru stran, nahrazení textu obrázkem, změna pozice, hlasové čtečky, změna velikosti, odsazení, zarovnání.
Lekce 23 - Bootstrap - Flex utilities
V tutoriálu CSS frameworku Bootstrap započneme flex utilities, které slouží k pohodlnému využívání flexboxu. Naučíme se směry a různá zarovnání.
Lekce 24 - Bootstrap - Flex utilities podruhé
V tutoriálu CSS frameworku Bootstrap dokončíme flex utilities, které slouží k pohodlnému využívání flexboxu. Naučíme se zalamování, pořadí a zarovnávání.
Lekce 25 - Bootsrap - Multimediální objekty a kontejnery
Mediální objekty na statusy a komentáře a kontejnery v CSS frameworku Bootstrap budou představeny tímto tutoriálem.
Lekce 26 - Bootstrap - Úvod do grid systémů
V tutoriálu si vysvětlíme proč obsah webu rozdělit do pomyslné mřížky, proč k tomu nepoužívat element table a jak fungují grid systémy.
Lekce 27 - Bootstrap - Grid systém Bootstrapu
V posledním tutoriálu dokončíme svou znalost CSS frameworku Bootstrap detailním popisem jeho grid systému včetně živých ukázek.