mobileweb 기기의 적정 확대 비율을 정의하는 viewport meta 태그‎ head.sub.php 수정 합니다 > 11.Nas_1

mobileweb 기기의 적정 확대 비율을 정의하는 viewport meta 태그‎ head.sub.php 수정 합니다

♨ 카랜더 일정 :

링크

https://play.google.com/store/apps/details?id=com.boatbrowser.free&feature=search_result#?t=W251bGwsMSwxLDEsImNvbS5ib2F0YnJvd3Nlci5mcmVlIl0. 820

첨부

11q.kr관리자 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 작성
192.♡.0.1 아이피
작성일 2012.08.25 01:30

19,077 조회
목록

\r\n

mobileweb 기기의 적정 확대 비율을 정의하는 viewport meta 태그

‎- 2010년 1월 29일\r\n

\r\n

blog.daum.net/soft33 - V 아름다운 나의 인생 V
maximum-scale : 최대 확대 비율 user-scalable ... 예：120%의경우1.2）, 표시단위에서 계산되는 값, minimum-scale～maximum-scale. minimum-scale, 배율의 ...

\r\n

-----------------------------------------

\r\n

수정부분 : head.sub.php

\r\n

\r\n

============ 변경전 ===================

\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=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

-------------------------------------------------------------------------

\r\n

안드로이드 웹브라우즈 boat브라우즈를 사용시 화면 좌우 화면 확대시 자동으로 정렬 됩니다.

\r\n

아래 어플을 사용 화면 확대 해보세요

\r\n

https://play.google.com/store/apps/details?id=com.boatbrowser.free&feature=search_result#?t=W251bGwsMSwxLDEsImNvbS5ib2F0YnJvd3Nlci5mcmVlIl0.

\r\n

==========================

\r\n

오늘은 처음으로 meta 값인 viewport 를 살표보도록 합시다. 우선 시원스럽게 사용방법부터 보지요. 메타값은 head 부분에 넣는 것은 다들 아시겠죠?

\r\n

\r\n

viewport는 화면의 확대를 관리하는 것입니다. 모바일 웹브라우져는 대부분 기기의 화면이 작기 때문에 원래의 페이지를 축소해서 보여줍니다. 하지만 모바일에 최적화 된 페이지는 그럴 필요가 없겠죠? width 를 100%로 주어 어떤 해상도에서도 딱 맞춤형으로 나오는 것이 사용성이 훨씬 좋아집니다. 그러기 위해서는 화면을 확대하는 것을 방지해야 하는데요. 이것을 사용하면 가로보기로 전환시에 확대가 되는 것을 방지 합니다. 코드의 내용을 자세히 보면, initial-scale 은 처음 열렸을 때, maximum-scale 은 확대시의 최대로 확대되는 비율을 나타냅니다. 그리고 user-scalabe 을 통해서 확대를 사용할지 안할지를 결정할 수 있습니다.

----------------------------------------------
Homepc.11q.kr
========================\n

[이 게시물은 관리자님에 의해 2013-11-18 21:29:50 11.H_BBS에서 이동 됨]

[ 추가 정보 ... 더보기) ]

뷰PDF 1,2