Pentru ce sunt folosite unitățile de măsură vh și vw atunci când se specifică dimensiuni în CSS?

Unitățile de măsură vh și vw în CSS sunt utilizate pentru a indica dimensiuni relative față de dimensiunile zonei de vizualizare (viewport) a browserului.

• vh (înălțimea viewport-ului): Reprezintă 1% din înălțimea zonei de vizualizare.
• vw (lățimea viewport-ului): Reprezintă 1% din lățimea zonei de vizualizare.

Scopul lor principal este de a crea un design adaptabil, în care dimensiunile elementelor depind de dimensiunile actuale ale ferestrei browserului, și nu de valori fixe în pixeli sau de dimensiunile elementelor părinte. Acest lucru permite scalarea ușoară a elementelor precum secțiuni pe întreaga înălțime sau lățime a ecranului, fonturi, imagini și alte componente, asigurând o experiență de vizualizare confortabilă pe dispozitive cu dimensiuni diferite ale ecranului.

De exemplu:

• height: 100vh; — face ca elementul să aibă înălțimea de 100% din înălțimea zonei de vizualizare.
• width: 50vw; — face ca elementul să aibă lățimea de 50% din lățimea zonei de vizualizare.