webové stránky a aplikácie / programovanie / databázové systémy / dizajn / SEO / vzdelávanie
Flexbox (flexible box) je technológia v CSS, ktorá umožňuje flexibilné usporiadanie elementov v jednoduchom, no výkonným spôsobe. Flexbox je ideálny pre vytváranie responzívnych rozložení, kde sa elementy prispôsobujú veľkosti obrazovky a zariadenia. Flexbox kontajner obsahuje jednu alebo viacero flexbox elementov. Každý flexbox element môže byť umiestnený do flexbox kontajnera. Flexbox kontajner definuje základné vlastnosti usporiadania…
Ukážeme si príklad HTML a CSS kódu na vytvorenie responzívneho elementu s obrázkom a textom vedľa seba. Tento kód používa flexbox a zabezpečuje, že obrázok a text sa zobrazia vedľa seba na širokých obrazovkách a nad sebou na užších obrazovkách. Tento kód používa flexbox a zabezpečuje, že obrázok a text sa zobrazia vedľa seba na…
Pomocou šiestich príkladov si vysvetlíme použitie FLEX BOXU pri tvorbe responzívnej webovej stránky. Príklad 1: jednostĺpcový layout – hlavička s obrázkom Príklad 2: trojstĺpcový layout – tri stĺpce s textom Príklad 3: trojstĺpcový layout – tri stĺpce s textom a farebným pozadím Príklad 4: viac položiek vedľa seba – využitie pri fotogalérii Príklad 5: presné…