Front-End Study/반응형 웹
뷰포트 (Viewport)
NewBean
2023. 5. 1. 12:43
뷰포트 (Viewport)
1. 뷰포트
- 화면에서 실제 내용이 표시되는 영역
- 뷰포트는 메타 태그를 이용해 화면의 크기 or 비율을 조절
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
2. 뷰포트 속성
속성명 | 속성값 | 속성 설명 |
width | device-width, 양수 | 뷰포트의 너비를 지정 |
height | device-height, 양수 | 뷰포트의 높이를 지정 |
initial-scale | 양수 | 뷰포트의 초기 배율 지정 (기본값 1) (축소 < 1 < 확대) |
user-scalable | yes, no | 뷰포트의 확대/축소 여부 지정 |
minimum-scale | 양수 | 뷰포트의 최소 축소 비율 지정 (기본값 0.25) |
maximum-scale | 양수 | 뷰포트의 최대 확대 비율 지정 (기본값 5.0) |