| 15번째 줄: | 15번째 줄: | ||
</html> | </html> | ||
</source> | </source> | ||
*width=device- | *width=device-width | ||
:기기 크기에 맞춤 | :기기 크기에 맞춤 | ||
:아이폰의 경우 뷰포트를 지정하지 않으면 뷰포트의 너비는 980px이 된다. | :아이폰의 경우 뷰포트를 지정하지 않으면 뷰포트의 너비는 980px이 된다. | ||
2012년 4월 15일 (일) 11:39 판
- 뷰포트, viewport
1 뷰포트 기초예제
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="width=480,user-scalable=yes,initial-scale=1.0,maximum-scale=3.0" />
<title>제목</title>
</head>
<body>
<p>내용</p>
</body>
</html>
- width=device-width
- 기기 크기에 맞춤
- 아이폰의 경우 뷰포트를 지정하지 않으면 뷰포트의 너비는 980px이 된다.
- initial-sacle=1.0
- 초기 배율을 1.0으로 설정
- user-scalable=no
- 확대축소 불가
2 아이폰 화면 크기
스마트폰 화면 크기 문서를 참고하십시오.- 아이폰: 320 x 480 px
- Status Bar 높이: 20px
- URL Bar 높이: 60px
- Button Bar 높이: 44px
3 속성
- width
- height
- initial-scale
- minimum-scale
- maximum-scale
- user-scalable
로그인하시면 댓글을 쓸 수 있습니다.
{{ comment.name }}
{{ comment.created | snstime }}
-
{{comment.page_title}} ―{{comment.name}}