💡

metaタグのviewportを使って自動縮小させないようにしてみた

2022/08/05に公開約500字

metaタグのviewportを使って自動縮小させないようにしてみた

おまじないのようにコレを入れていたので、ちゃんと調べてみた。

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />

そもそもviewportとは?

コンテンツの表示領域を設定するもの。

各属性値について

今回の設定について

属性 意味
width 表示領域の幅
initial-scale 初期のズーム倍率
user-scalable ズーム操作OKか

なので今回の設定では

  • 表示領域はデバイスに合わせる(device-width)※ここはpixel数でもOKらしい
  • 初期のズーム倍率は1.0倍
  • ズーム操作させない

となる。
(初期のズーム倍率は必要ないかも…?)

他にも属性値があるので必要なら調べるけど、「モバイルは考慮しないけどそれなりに見れるといいな」ぐらいならこの設定でOKそう。

Discussion

ログインするとコメントできます