Unitățile vw și vh în CSS

Unitățile vw și vh permit să setați dimensiunea relativ la zona de vizualizare a ferestrei browser-ului. Să analizăm un exemplu.

Să presupunem că avem un div:

html<div></div>

Să îi setăm lățimea egală cu jumătate din lățimea zonei de vizualizare și înălțimea egală cu jumătate din înălțimea zonei de vizualizare:

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

Să vedem ce am obținut:

Задание 1

Este dat un div. Setați-i un spațiu superior, egal cu 30% din înălțimea zonei de vizualizare.

Задание 2

Este dat un div. Setați-i lățimea și înălțimea, egale cu 70% din lățimea zonei de vizualizare.