🚀 Pokročilý kurz

Kurz HTML a CSS
pre pokročilých

Posuňte svoje kódovanie na profi úroveň. Ovládnite moderné techniky rozloženia stránok (CSS Grid, pokročilý Flexbox), vytvorte plynulé animácie, plnú responzivitu a zorganizujte svoj kód pomocou BEM metodiky a CSS premenných.

⏱️

Trvanie –

💰

Cena –

🎓

Certifikát Po absolvovaní

Objednať kurz

VS Code – styles.scss

SCSS$primary: hsl(220, 90%, 55%) · BEM

Technika

Podpora

Stav

CSS Variables

97%

✓ Modern

Container Queries

91%

✓ Modern

@layer

89%

⚡ New

Animations

99%

✓ Stable

Čo sa na živom online kurze HTML a CSS pre pokročilých naučíte

Nové štandardy responzívneho kódovania a moderné UI architektúry.

Sémantika, SEO a prístupnosť (a11y)

Pokročilé HTML5 sémantické značky (article, section, nav)
Tvorba formulárov s validáciou a vlastným dizajnom
Základy prístupnosti (ARIA atribúty, podpora čítačiek)
Optimalizácia HTML pre vyhľadávače (On-page SEO)
Práca so značkami meta, viewport a favicon

Komplexné rozloženia s CSS Grid

Architektúra mriežky (Grid container, grid items)
Definícia stĺpcov a riadkov (grid-template-columns/rows)
Umiestňovanie prvkov do špecifických oblastí (grid-area)
Používanie fractional jednotiek (fr) a funkcií minmax/repeat
Kombinácia CSS Grid a Flexboxu pre dokonalé layouty

Pokročilý Flexbox a Responzivita

Pochopenie ohybnosti: flex-grow, flex-shrink, flex-basis
Tvorba responzívnych dizajnov pomocou Media Queries (@media)
Stratégia "Mobile First" vs "Desktop First"
Používanie relatívnych jednotiek (rem, em, vh, vw) namiesto px
Tvorba responzívnych obrázkov (picture a srcset)

Animácie, prechody a transformácie

Plynulé zmeny stavov pomocou CSS Transitions
Práca s hover a focus efektmi na interaktívnych prvkoch
Používanie transformácií (translate, scale, rotate) v 2D a 3D
Tvorba vlastných kľúčových snímok (@keyframes) pre animácie
Optimalizácia výkonu animácií (will-change)

Moderné CSS funkcie a premenné

Deklarácia a použitie Custom Properties (CSS premenných)
Prepínanie Dark Mode / Light Mode pomocou premenných
Dynamické výpočty v kóde pomocou funkcie calc()
Využitie logických funkcií clamp(), min(), max() pre responzivitu
Práca s CSS filtrami (blur, drop-shadow, brightness)

Architektúra kódu (BEM a preprocesory)

Organizácia rozsiahlych CSS súborov
Pochopenie metodiky BEM (Block, Element, Modifier)
Špecifickosť selektorov a prečo sa vyhnúť použitiu !important
Krátky úvod do sveta CSS preprocesorov (Sass/SCSS)
Ako fungujú CSS frameworky (Tailwind, Bootstrap) a kedy ich použiť

Kurz HTML a CSSpre pokročilých