9. diel - Tvorba Bootstrap šablóny z PSD - Responzivita
V minulej lekcii, Tvorba Bootstrap šablóny z PSD - Dokončenie pre desktop , sme dokončili kódovanie našej bootstrapové šablóny podľa návrhu v PSD súbore. Všetky časti sú na svojich miestach, zostáva pridať responzivitu, aby sme ju mohli zobrazovať aj na menších zariadeniach.
Rekapitulácia
Ešte než sa pustíme do práce, poďme si v rýchlosti zopakovať skratky pre breakpoint y, ktoré už poznáme z kurzu Bootstrap. Sú to hraničné veľkosti rôznych zariadení:
xs(extra small)sm(small)md(medium)lg(large)xl(extra large)
Pri použití breakpointové skratky bude bootstrap trieda platiť pre danú veľkosť a pre všetky vyššie.
Príklady
Poďme si ukázať pár cvičných príkladu, nech je v tom poriadok 
Ak nastavíme napr. .col-md-6, znamená to, že daný stĺpec
bude zaberať polovicu gridu od šírky stránky medium (a vyššie).
V prípade, že napíšeme .col-sm-12, bude sa stĺpec
zobrazovať
...koniec náhľadu článku...
Pokračuj ďalej
Došiel si až sem a to je super! Veríme, že ti prvé lekcie ukázali niečo nového a užitočného.
Chceš v kurze pokračovať? Prejdi do prémiovej sekcie.
ročné PREDPLATNÉ
44 €
mesačne, platené ročne (528 €)14 000+ lekcií, cvičení a testov
6 000+ ti zostane navždy
Neobmedzený prístup ku všetkým aktuálnym
aj pripravovaným kurzom.
Kúpiť iba tento kurz
Získaj okamžitý prístup ku kurzu bez
časového obmedzenia.
17 €
Pred kúpou tohto článku je potrebné kúpiť predchádzajúci diel
Obsah článku spadá pod licenciu Premium no-reselling, kúpou článku súhlasíš s Prevádzkovými podmienkami.
Komerčný článok (licencia no-reselling)
Tento článok vznikol na základe mnohoročných skúseností v odbore a opisuje vývoj profesionálneho komerčného produktu alebo jeho súčasti, ktorú možno priamo využiť za účelom zisku alebo k preniknutiu do komerčnej sféry IT odvetvia.
Tieto vrcholové znalosti sprístupňujeme samozrejme iba niektorým členom komunity, ktorí sa majú záujem vypracovať na profesionálov v odbore a preto sú k dispozícii len za kredity. Kód z článku môžete použiť pre jeden svoj komerčný projekt. Nie je ho však možné prepredávať (raz zakúpiť a následne predať ďalej v niekoľkých projektoch). Ak potrebujete širšie využitie kódu, radi sa s vami dohodneme na komerčnej licencii. Viac informácií nájdete v článku Licencia.
Ste pripravení stať sa profesionálmi v odbore? Stačí kliknúť.
Popis článku
Požadovaný článok má nasledujúci obsah:
V HTML a CSS tutoriálu pridáme bootstrapové šablóne responzivitu, aby sa zobrazovala korektne aj na mobilných zariadeniach.
