Vw og vh enheter i CSS

Enhetene vw og vh lar oss sette størrelsen i forhold til visningsområdet i nettleservinduet. La oss se på et eksempel.

La oss si at vi har en div:

html<div></div>

La oss gi den en bredde på halvparten av bredden til visningsområdet og en høyde på halvparten av høyden til visningsområdet:

cssdiv {
  width: 50vw;
  height: 50vh;
  margin: 30px auto;
  border: 1px solid red;
}

La oss se hva vi fikk:

Задание 1

Det er gitt en div. Sett en toppmarginal lik 30% av høyden til visningsområdet.

Задание 2

Det er gitt en div. Sett en bredde og høyde lik 70% av bredden til visningsområdet.