Kādēļ CSS norādījumos izmanto vienības vh un vw?

CSS-ā vh un vw mērvienības tiek izmantotas izmēru norādīšanai, kas ir proporcionālas skatīšanās lauka (viewport) izmēriem.

• vh (skatīšanās lauka augstums): Attēlo 1% no skatīšanās lauka augstuma.
• vw (skatīšanās lauka platums): Attēlo 1% no skatīšanās lauka platuma.

To galvenais mērķis ir izveidot pielāgojamu dizainu, kur elementu izmēri ir atkarīgi no pašreizējiem pārlūkprogrammas loga izmēriem, nevis no fiksētām vērtībām pikseļos vai vecāku elementu izmēriem. Tas ļauj viegli mērogot elementus, piemēram, pilna augstuma vai platuma sadaļas, fontus, attēlus un citus komponentus, nodrošinot ērtu skatīšanos dažādu ekrāna izmēru ierīcēs.

Piemēram:

• height: 100vh; — padara elementu ar 100% no skatīšanās lauka augstuma.
• width: 50vw; — padara elementu ar 50% no skatīšanās lauka platuma.