반영훈/웹 개발
[CSS]vw, vh, vmin, vmax
Banda
2020. 6. 20. 12:34
VW와 VH 각각
Viewport width, Viewport height
이 둘 또한 반응형으로 사용하기 좋음
0~100사이의 값을 가짐.
뷰포트 즉 현재 브라우저창이 변함에 따라 크기가 변화됨.
vmax
width: 50vmax;
->현재 뷰포트의 가로와 세로 중 더 넓은 사이즈의 50%를 가로사이즈로 사용한다.
vmin
width: 50vmin;
-> 위와 비슷한 개념으로 현재 뷰포트의 가로와 세로중 더 좁은 사이즈의 50%를 가로사이즈로 사용한다.