mobileweb 기기의 적정 확대 비율을 정의하는 viewport meta 태그 head.sub.php 수정 합니다
링크
컨텐츠 정보
- 20,919 조회
- 0 추천
- 목록
본문
\r\n
\r\nmobileweb 기기의 적정 확대 비율을 정의하는 viewport meta 태그
- 2010년 1월 29일\r\n\r\n
\r\n\r\n
blog.daum.net/soft33 - V 아름다운 나의 인생 V
maximum-scale : 최대 확대 비율 user-scalable ... 예：120%의경우1.2）, 표시단위에서 계산되는 값, minimum-scale～maximum-scale. minimum-scale, 배율의 ...
\r\nmaximum-scale : 최대 확대 비율 user-scalable ... 예：120%의경우1.2）, 표시단위에서 계산되는 값, minimum-scale～maximum-scale. minimum-scale, 배율의 ...
-----------------------------------------
\r\n수정부분 : head.sub.php
\r\n\r\n
\r\n============ 변경전 ===================
\r\n
\r\n \r\n
------------------------------------------------------------------------- \r\n
\r\n<!DOCTYPE html>
<html lang="ko">
\r\n <head>
\r\n <meta name="Author" content="g4mob.com"/>
\r\n <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />
\r\n============ 변경후 ===================
\r\n<!DOCTYPE html>
\r\n<html lang="ko">
\r\n <head>
\r\n <meta name="Author" content="g4mob.com"/>
\r\n <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=10.0, minimum-scale=1.0, user-scalable=yes, target-densitydpi=medium-dpi" />
\r\n <!-- head.sub.php 모바일기기 확대 가능하게 사용자 zoom 기능 user-scalable=yes 수정부 -->
안드로이드 웹브라우즈 boat브라우즈를 사용시 화면 좌우 화면 확대시 자동으로 정렬 됩니다.
\r\n아래 어플을 사용 화면 확대 해보세요
\r\n\r\n==========================
\r\n오늘은 처음으로 meta 값인 viewport 를 살표보도록 합시다. 우선 시원스럽게 사용방법부터 보지요. 메타값은 head 부분에 넣는 것은 다들 아시겠죠?
\r\n\r\n
\r\n
----------------------------------------------<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
\r\n
viewport는 화면의 확대를 관리하는 것입니다. 모바일 웹브라우져는 대부분 기기의 화면이 작기 때문에 원래의 페이지를 축소해서 보여줍니다. 하지만 모바일에 최적화 된 페이지는 그럴 필요가 없겠죠? width 를 100%로 주어 어떤 해상도에서도 딱 맞춤형으로 나오는 것이 사용성이 훨씬 좋아집니다. 그러기 위해서는 화면을 확대하는 것을 방지해야 하는데요. 이것을 사용하면 가로보기로 전환시에 확대가 되는 것을 방지 합니다. 코드의 내용을 자세히 보면, initial-scale 은 처음 열렸을 때, maximum-scale 은 확대시의 최대로 확대되는 비율을 나타냅니다. 그리고 user-scalabe 을 통해서 확대를 사용할지 안할지를 결정할 수 있습니다.
Homepc.11q.kr
========================\n
[이 게시물은 관리자님에 의해 2013-11-18 21:29:50 11.H_BBS에서 이동 됨]
관련자료
-
링크
댓글 0
등록된 댓글이 없습니다.