🚀 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
1
CSS Variables
97%
✓ Modern
2
Container Queries
91%
✓ Modern
3
@layer
89%
⚡ New
4
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.

1

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
2

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
3

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)
4

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)
5

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)
6

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ť

Objednávka kurzu

Načítavam termíny…
Prejsť do košíka →