通常、HTML5モバイルページを作成するときに、ページに表示される要素の比率が間違っていることがわかります。そのとき追加する必要があるのは、
<meta name="viewport" content="width=device-width,initial-scale=1">
または
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
です。それでは、この文を説明しましょう。
viewport: 表示ウィンドウを表します;
width=device-width、initial-scale=1.0: デバイスの画面幅に等しい表示ウィンドウの幅を表します、initial-scale=1.0。初期スケーリング 比率は 1.0 です。
minimum-scale: スケーリングに許可される最小比率を示します。
maximum: スケーリングに許可される最大比率を表します。
user-scalable: ユーザーがページをズームできるかどうかを示します。はいまたはいいえです
問題例:
現象:
ユーザーがモバイルページ上のテキストを編集するために入力ボックスをクリックすると、ページが自動的に拡大されます
解決策:
head> タグに挿入するか、ユーザーがページをズームできないようにします user-scalable=no
概要
以上がHTML5モバイルページのスケーリング問題の解決策を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
