HTML

Chromeの検証ツールで表示が縮小されるのを修正した話

概要

Google Chromeの検証(開発者ツール)を開いてレスポンシブ表示を確認しようとしたところ、
要素のpixelなどは確認するとちゃんとなっているのに、文字やアイコンなどが小さくなっていました。

対応

viewportの設定が抜けていました。
<head>タグ内に下記

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

を追加することでデバイスの表示をエミュレートしても想定どおりに表示されるようになりました。

-HTML

Copyright© F27P , 2022 All Rights Reserved Powered by AFFINGER5.