2023年12月06日 更新

Google Chromeのデベロッパーツールで楽に画面表示シミュレーション

どうも、クラゲジュニアです。

Google ChromeのデベロッパーツールではWebページの外観を検証するために画面サイズをシミュレーションする機能が備わっています。

今回は、クリック操作でWebページの外観を変更してみます。

環境

クラゲジュニアは下記の環境で検証しました。

• Google Chrome バージョン119.0.6045.161（64 ビット）
• Windows 11 pro 23H2

手順

適当なページをGoogle Chromeで開き、右クリックメニューから検証を選択します。

下記に示すアイコンをメニューバーから選択します。

下記の枠で示す箇所をクリックすると、表示されているサイズの画面でページを表示してくれます。

以上です。