Vipimo vw na vh kwenye CSS

Vipimo vw na vh huruhusu kuweka ukubwa kuhusiana na eneo la kutazama la dirisha kivinjari. Hebu tuangalie kwa mfano.

Tuchukulie tuna div fulani:

html<div></div>

Hebu tuweke upana wake uwe nusu ya upana wa eneo la kutazama na urefu uwe nusu ya urefu wa eneo la kutazama:

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

Hebu tuone tulichopata:

Задание 1

Imetolewa div. Wekea pengo la juu linalofanana na 30% ya urefu wa eneo la kutazama.

Задание 2

Imetolewa div. Wekea upana na urefu unaofanana na 70% ya upana wa eneo la kutazama.