뷰포트 설정 (viewport)

 

 

 

<meta>태그를 사용하면 페이지의 초기 비율과 최대/최소 비율, 그리고 사용자에 의한 스케일 조정 여부등을 설정할 수 있습니다.

<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no” />

 

위와 같이 메타(meta)태그의 이름(name)에 뷰포트(viewport)라고 지정되어 있으면 이는 스케일을 인식합니다.

그리고 content 속성에 스케일링에 관련된 내용을 기술하면 되다. Content속성 주요 내용은 아래와 같습니다.

 

 

---

 

 

initial-scale : 페이지가 처음 로딩 될 때의 화면 확대 비율
maximum-scale : 최대 확대 비율 (0~1.0)
minimum-scale : 최대 축소 비율 (0~1.0)
user-scalable : 사용자가 줌으로 확대나 축소에 대한 가능 여부 (yes,no)
width : 너비 (device-width 디바이스 너비)
height : 높이 (device-height 디바이스 높이)

 

*1.0은 100%를 의미합니다.