본문 바로가기
반영훈/웹 개발

[CSS]vw, vh, vmin, vmax

by Banda 2020. 6. 20.

VW와 VH 각각

Viewport width, Viewport height

이 둘 또한 반응형으로 사용하기 좋음

0~100사이의 값을 가짐.

뷰포트 즉 현재 브라우저창이 변함에 따라 크기가 변화됨.

 

vmax

width: 50vmax;

->현재 뷰포트의 가로와 세로 중 더 넓은 사이즈의 50%를 가로사이즈로 사용한다.

 

vmin

width: 50vmin;

-> 위와 비슷한 개념으로 현재 뷰포트의 가로와 세로중 더 좁은 사이즈의 50%를 가로사이즈로 사용한다.

댓글