viewport metaの説明と浅見
一般的な使用
幅はデバイス幅、初期スケールは1倍、ユーザースケールは禁止
属性の説明
width:数値設定可能、またはdevice-width(デバイス幅)指定可能
Height:数値を設定するか、device-height(デバイス高さ)に指定します.
initial-scale:最初のページへの初期スケール
minimum-scale:最小スケールの縮小を許可
maximum-scale:最大スケールの拡大を許可
user-scalable:使用者のスケールを許可し、1 or 0(yes or no)
幅はデバイス幅、初期スケールは1倍、ユーザースケールは禁止
属性の説明
width:数値設定可能、またはdevice-width(デバイス幅)指定可能
Height:数値を設定するか、device-height(デバイス高さ)に指定します.
initial-scale:最初のページへの初期スケール
minimum-scale:最小スケールの縮小を許可
maximum-scale:最大スケールの拡大を許可
user-scalable:使用者のスケールを許可し、1 or 0(yes or no)
viewport meta
，
@viewport {
width: device-width;
initial-scale: 1.0
}
width=device-width
， viewport width device-width ， ， ， width ， html css width 。
，device-width view width ， iphone 4 ，device-width=320 ， 480， javascript UA 。
user-scalable
、 ， 、 ， ， 0， no， ， 1 yes。
， 。
（ html body width），
，
n ，( x 10.0)
（ ）
， ，
initial-scale=10.0
maximum-scale=15.0
， x 10.0， x 15.0，
initial-scale=15.0
maximum-scale=10.0
， x 15.0，
x 15.0，
* 、 ， *。
， ，
initial-scale=5.0
minimum-scale=1.0
， x 5.0， x 1.0， ，
initial-scale=1.0
minimum-scale=5.0
， x 1.0， x 1.0 ，
、 ， 。
， ，
initial-scale=1.0
minimum-scale=5.0
maximum-scale=0.1
， ？？？
，init x 1.0， max x 1.0， min x 1.0， 。
viewport meta
viewport ，
，
，
device ， javascript， UA(User agent)， viewport， ，
viewport = document.querySelector("meta[name=viewport]");
viewport.setAttribute('content', 'width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;');
css media query ， viewport meta ， ， ， css @viewport ， W3C viewport property index table。
， ， web ， ， 。
- http://hsinyu00.wordpress.com/2011/04/05/mobile-web-viewport/
- http://fairyfish.net/m/viewport-meta-tag/
- http://dev.w3.org/csswg/css-device-adapt
- http://stackoverflow.com/questions/3588628/can-i-change-the-viewport-meta-tag-in-mobile-safari-on-the-fly