September discount week
Tento týden až 80% sleva na e-learning týkající se jazyka C
50 % bodů zdarma na online výuku díky naší Slevové akci!

Kompletní kurz CSS frameworku Bootstrap - Online kurz

On-line kurz vás provede CSS frameworkem Bootstrap, nejpopulárnějším nástrojem pro snadnou a rychlou tvorbu webových šablon. Včetně praktických ukázek.

Úvod do CSS frameworku Bootstrap

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Reboot

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Typografie

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Obrázky

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ů.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Úvod do grid systémů

Lekce 5

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Grid systém Bootstrapu

Lekce 6

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.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 1.-6. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 1.-6. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma práce s texty, rámečky a obrázky. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
Zdarma Zobrazit popis
Bootstrap - Tabulky

Lekce 7

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Tlačítka

Lekce 8

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ší.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 7.-8. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 7.-8. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma tvorba tlačítek a tabulek a jejich vlastní úprava v CSS. Jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Formuláře

Lekce 9

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Další možnosti formulářů

Lekce 10

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ů.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 9.-10. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 9.-10. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma formuláře, vložení obrázků, checkboxů a tlačítek. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Jumbotron a Badges

Lekce 11

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - List groups

Lekce 12

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.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 11.-12. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 11.-12. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma jumbotron, badges a list group. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Karty

Lekce 13

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í.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Carousely a Progress

Lekce 14

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.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 13.-14. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 13.-14. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma úprava karet, carousely a progress. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Collapse a Accordion

Lekce 15

Bootstrap - Collapse a Accordion

Sbalovací/rozbalovací obsah komponent Collapse a harmoniky Accordion popisuje podrobný tutoriál CSS frameworku Bootstrap.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Dropdowns

Lekce 16

Bootstrap - Dropdowns

V tutoriálu si popíšeme rozbalovací tlačítka, která jsou v CSS frameworku Bootstrap reprezentována jako komponenta Dropdown.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 15.-16. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 15.-16. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma collapse, accordion a dropdown. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Utilities

Lekce 17

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í.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Flex utilities

Lekce 18

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í.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Flex utilities podruhé

Lekce 19

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í.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 17.-19. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 17.-19. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku Bootstrap na téma responzivita, utilities a flex utilities. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Navigace

Lekce 20

Bootstrap - Navigace

V tutoriálu se naučíme stylovat navigaci a to včetně dynamických záložek v CSS frameworku Bootstrap.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Navigační lišta

Lekce 21

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.
Napsal David Čápka
Zdarma Zobrazit popis
Řešené úlohy k 20.-21. lekci Bootstrap CSS frameworku

Cvičení

Řešené úlohy k 20.-21. lekci Bootstrap CSS frameworku

Řešené úlohy v CSS frameworku na téma navigace a její přizpůsobení. Úlohy jsou řazené dle obtížnosti s řešením ke stažení.
Napsala Lucie Hartingerová
PRO Zobrazit popis
Bootstrap - Paginace, Upozornění a Drobečková navigace

Lekce 22

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Modální dialogy

Lekce 23

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Popovers

Lekce 24

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Scrollspy

Lekce 25

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.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Tooltipy

Lekce 26

Bootstrap - Tooltipy

Tooltipy, jejich inicializace a ovládání JavaScriptem, to je to, co se naučíte v tomto tutoriálu CSS frameworku Bootstrap.
Napsal David Čápka
Zdarma Zobrazit popis
Bootstrap - Multimediální objekty a kontejnery

Lekce 27

Bootstrap - Multimediální objekty a kontejnery

Mediální objekty na statusy, komentáře a kontejnery v CSS frameworku Bootstrap budou představeny tímto tutoriálem.
Napsal David Čápka
Zdarma Zobrazit popis


 

Aktivity (5)