JavaScript - ブラウザのズームサイズの実装原理

Question

RT, 個人的な使用習慣のため、Chrome を使用する場合、デフォルトのズーム率は 90% に調整されています。今日一部のページをテストしたところ、スタイルの乱れが発生しました。ただし、ズーム率が 100% の場合、すべてのブラウザー テストは正常でした正常であり、低解像度のコンピュータでのテストも正常だったので、スケーリングの原理を理解することを思いつきました。いくつかの情報を確認した後、HTML タグの幅と高さが変更されたと述べましたしかし、実際にテストしてみたところ、うまくいきませんでした。そうではないので、専門家の皆様にブラウザのスケーリングの原理は何なのかお聞きしたいのですが、ありがとうございます

Answer 1

私たちが普段見ている表示ページは、一般的にデバイスのピクセルサイズ(100%ズーム)、より正確にはデバイスのピクセルとCSSのピクセルが1:1のシーンです。画面をズームしても、デバイスのピクセルは変更されませんが、CSS ピクセルは変更されます。具体的な詳細については、このブログを読むことをお勧めします: https://www.quirksmode.org/mo...

Answer 2

リーリー

Answer 3

CSS には、コンテンツのスケーリングを制御する zoom 属性があります。ブラウザのズームもおそらく同様の方法で実装されています。位置ずれの問題に関しては、ほとんどのブラウザにはフォントのデフォルトの最小値があり、それが最小値より小さい場合、テキストは拡大縮小されず、コンテンツが折り返されてレイアウトが引き伸ばされてしまいます。