この「initial-scale=1.0」というのを指定しておくと、
桁違いに挙動を操作しやすくなるということを学びました。
お試しあれ。
参考事例。
どういうケースを想定しているかというと、
(横幅)1050px * (高さ)2000pxの画像と、
(横幅)1300px * (高さ)1050pxの画像
を表示させる時を想定しています。
bodyタグの中身はdivとimgタグがそれぞれ一個あるだけです。
それぞれの画像を表示してみるとわかるんですが、
初期表示時に、
(横幅)1050pxは横スクロールは出ない。
(横幅)1300pxは横スクロールは出る。
この場合は綺麗に表示させたいので、
(横幅)1050pxの場合はそのままでOKですが、
(横幅)1300pxの方は、横幅ピッタリ + センター寄せで表示させるためにあーでもないこーでもない、
とやることになるんですね。
結局のところ、
html or css or viewportで操作するのを諦めて、
画像のサイズ自体をそれぞれのデバイスに合わせるのが、一番フレキシブルでないですかと。
(cssのbackground-sizeプロパティというのも試したんですが、initial-scale=1.0無しだと画像がピンぼけしたので辞めました。)
まぁそういう事です。