ブートストラップを適応させる方法

#ブートストラップを適応させる方法

ブートストラップ画面の適応

Bootstrap によって開発された Web サイトをモバイル対応にし、適切な描画とタッチ スクリーンのスケーリングを確保するには、以下に示すように、Web ページの先頭にビューポート メタ タグを追加する必要があります。

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

width 属性デバイスの幅を制御します。 Web サイトがさまざまな画面解像度のデバイスで表示されることを想定して、Web サイトをデバイス幅に設定すると、さまざまなデバイスで正しくレンダリングされます。

initial-scale=1.0 を指定すると、Web ページが読み込まれるときに、スケーリングなしで 1:1 の比率でレンダリングされます。

モバイル ブラウザでは、ビューポート メタ タグに user-scalable=no を追加することでズームを無効にできます。

通常、maximum-scale=1.0 は user-scalable=no とともに使用されます。ズームを無効にすると、ユーザーはスクロールのみできるようになり、Web サイトがネイティブ アプリのように見えます。

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

関連する推奨事項:「

ブートストラップ チュートリアル」

以上がブートストラップを適応させる方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。