Đơn vị vw và vh trong CSS

Các đơn vị vw và vh cho phép đặt kích thước tương đối với vùng xem của cửa sổ trình duyệt. Chúng ta hãy xem ví dụ.

Giả sử chúng ta có một div nào đó:

html<div></div>

Hãy đặt cho nó chiều rộng bằng một nửa chiều rộng vùng xem và chiều cao bằng một nửa chiều cao vùng xem:

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

Hãy xem chúng ta nhận được gì: