Chromeのスケーリングを無効にする

Chromeのスケーリングを無効にする

Chromeに小さなボックスを表示しています

<div style="width:100px;height:100px;background:red"></div>

しかし、実際の大きさは 130 ピクセルです。Chrome は、私の 1080p モニターのため、すべての Web を拡大縮小しています。

例1[1]

無効にするにはどうすればいいですか? これは、Web サイトを開発しているときにのみ煩わしいものです。

例2

答え1

Google Chrome バージョン 54 以降では、コンピューターの DPI 設定を検出し、それに応じて Web ブラウザーのサイズを調整するようになりました。以前は、Google Chrome はシステムの DPI 設定を考慮していませんでしたが、現在は考慮しており、これが大きなインターフェースの問題の根本的な原因です。

システムで DPI が 100 パーセント以上に設定されている場合は、「ズームイン」の効果が得られます。ほとんどの場合、これはエンドユーザーが望むものですが、Web 開発者はそうではありません。

Chrome でシステム DPI 設定を無視するように強制するには、次のいずれかのパラメータを使用して Chrome を起動します (Chrome のバージョンと OS に応じて 2 つの可能性があります)。

  • /high-dpi-support=1 /force-device-scale-factor=1
  • --high-dpi-support=1 --force-device-scale-factor=1

答え2

私の問題は、gnome の「大きなテキスト」アクセシビリティ設定でした。Chrome ブラウザでそれが認識されるとは思っていませんでした。そのチェックを外すと、Chrome は期待どおりに動作するようになりました。

関連情報