Đơ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 đó:
<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:
div {
width: 50vw;
height: 50vh;
margin: 30px auto;
border: 1px solid red;
}
Hãy xem chúng ta nhận được gì:
Cho một div. Hãy đặt cho nó khoảng cách lề phía trên bằng
30% chiều cao vùng xem.
Cho một div. Hãy đặt cho nó chiều rộng và chiều cao bằng
70% chiều rộng vùng xem.
