レスポンシブウェブデザインの欠陥が拡大する

Question

私はウェブサイトを反応させましたが、電話機にロードすると自動的にズームされてビューポートも適用されましたが、解決策は見つかりませんでした。

• ビューポート
• Jクエリ これらは私の問題を解決していません。

いずれかは、私はちょうど自分自身同様の問題を解決して

Answer 1

私はあなたの問題を理解してこれを修正するために助けてください。

方法1 特定のデバイスグループを対象にして適用するズームの量を指定できます。これは、ズームで拡大しようとしているから、あなたのウェブサイトを維持する必要があり、あなたのindex.html

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

にこれを追加してみてください。

これが動作しない場合は、CSS

@viewport { width: 100vw ; min-zoom: 100% zoom: 100% ; } 

お使いのデバイスの範囲を見つけるために、ズームと幅の値で遊んでみて特定のデバイスをターゲットにしてみてください。

方法2 あなたのラップトップまたはデスクトップでFirefoxを開き、あなたのサイトに移動してください。 Firefoxのオプションでは、応答ビューを選択します。 ctrl + shift + cを押してページ上にカーソルを置くと、ページ全体のコンテナが選択されます。右下にはcssのウィンドウがあります。そこにはズームインされた要素を見つける必要があります。

をまた、あなたのウェブサイトにあなたの質問を更新してください