Blog

スマホサイトのピンチアウト拡大について

2015/11/06

css ホームページ制作 スマートフォン

スマホサイトでピンチによる拡大については考えていなかったので、
対応、非対応については、対応できない形で制作をしていましたが、
クライアントさんからの要望で拡大できるようにしました。

参考サイト
viewportの書き方でピンチによる拡大・縮小ができるのがいいのかできないのがいいのか

<head>~</head>にどちらかを書きます。

ピンチによる拡大・縮小ができない
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
 
ピンチによる拡大・縮小ができる
<meta name="viewport" content="width=device-width,initial-scale=1.0">

上記参考サイトでcssの指定もあったので追加

body {
  -webkit-text-size-adjust: 100%;
}

上記のCSSについては
-webkit-text-size-adjust: none を絶対に設定してはいけない理由
も参考にしました。



カテゴリー

月間アーカイブ

MORE

ミュージシャンズ・プラザ

神社仏閣ホームーページ制作

ホームページ制作問合せ