[解決済み] レスポンシブWebサイトがモバイルで全幅に拡大表示される。

質問

Bootstrapのレスポンシブ・ナビゲーション・バーをテストしているのですが、その際に デモ ウェブサイトがあります。デスクトップでブラウザのサイズを変更すると、ナビバーが折りたたみ可能なメニューになり、上部に小さなアイコンが表示され、それをクリックするとさらにメニューボタンが表示されます。

しかし、モバイル ブラウザ (Android の chrome とインターネット ブラウザで試しました) で試したところ、レスポンシブ デザインが表示されませんでした。デスクトップのような非常に小さなバージョンのウェブサイトしか見ることができませんでした。

どなたか、私が間違っていることを指摘していただけないでしょうか。

どのように解決するのですか？

これをHTMLの頭に追加してください...

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

これは、より小さなデバイスのブラウザに、ページの拡大縮小方法を伝えるものです。これについては、こちらで詳しく説明されています。 https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html