Na čo sa používajú jednotky vh a vw pri určovaní veľkostí v CSS?

Jednotky merania vh a vw v CSS sa používajú na označenie rozmerov vzhľadom na veľkosť zobrazenia (viewport) prehliadača.

• vh (výška zobrazenia): Predstavuje 1% výšky zobrazenia.
• vw (šírka zobrazenia): Predstavuje 1% šírky zobrazenia.

Ich hlavný účel je vytvoriť responzívny dizajn, kde veľkosti prvkov závisia od aktuálnych rozmerov okna prehliadača, a nie od pevných hodnôt v pixeloch alebo od veľkostí rodičovských prvkov. To umožňuje ľahké škálovanie prvkov, ako sú sekcie na celú výšku alebo šírku obrazovky, písma, obrázky a ďalšie komponenty, zabezpečujúc pohodlné zobrazenie na zariadeniach s rôznymi veľkosťami obrazoviek.

Napríklad:

• height: 100vh; — spôsobí, že prvok bude vysoký 100% výšky zobrazenia.
• width: 50vw; — spôsobí, že prvok bude široký 50% šírky zobrazenia.