Bootstrapでスマホがレスポンシブ対応にならない場合

Pocket

とても基本的な話でしたが、viewportを忘れていました。

対応はheadタグ内に以下1行、metaタグでviewportの指定を入れるだけです。

<meta name="viewport" content="width=device-width">

bootstrapを使わない場合はviewportやメディアクエリを使用していましたが、つい忘れてしまっていました。

bootstrapでグリッドシステムを使っているはずなのに、スマホがPC画面と同じようなサイズで表示されるという場合はviewportを忘れているかもしれません。

細かい部分はメディアクエリを使ってタグ(要素)の表示・非表示やサイズ変更をすると良いかと思います。

忘れそうなので備忘。

広告

Pocket

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です