뷰포트 (viewport) 란?

웹페이지를 사용자가 보는 영역을 말함. PC에서 보던 웹페이지 브라우저의 크기를 줄이면 웹페이지 내용이 일부 가려지거나 스크롤을 해야하는 경우가 있음. 여기서도 브라우저 영역에서 보이는 부분이 뷰포트임. 브라우저의 크기를 줄여도 웹페이지 내용이 사용자들에게 잘보이도록 브라우저의 크기마다 뷰포트의 크기를 지정해서 바꿈.

모바일 휴대폰과 태블릿, 데스크탑PC 등의 기기가 다양해서 뷰포트의 크기도 많음.

  • width : 뷰포트 너비

    device-weight

  • height : 뷰포트 높이

    device-height

  • user-scalable :확대/축소 가능여부

    yes(기본값) / no

  • initial-scale: 초기 확대/축소 값

    1(기본값) ~ 10

  • minimum-sacle :최소 확대/축소 값 , 줄일수 있는 최소 크기

    (기본값 0.25) 0~10

  • maximum-scale: 최대 확대/축소 값, 늘릴수있는 최대크기

    (기본값 1.6) 0~10

profile
매일 하는 것보다 중요한 건 그럼에도 불구하고 그만두지 않는 것

0개의 댓글