【ブログ記事の画面確認にもオススメ】PCでスマホ画面を確認する方法

どうも、たろけんです。

今回はPC画面にて
スマホ表示画面をチェックする方法を解説していきます。

これはグーグルChromeの機能である
”デベロッパーツール”を使用します。

Webデザイナーが使うのはもちろんのこと、
ブログ執筆で改行(PCとスマホの改行は違うため)
など見やすさのcheckにも最適です。

覚えておくととても便利なので
サクッと覚えてしまいましょう!

デベロッパツールの使い方

まずはChromeを起動して
スマホ画面で確認したいページを表示します。

次に、Macユーザーは
「command」+「option」+I(アイ)

Windowsユーザーは「F12」

のキーを押します。

そうすると↓のような画面に切り替わります。

そうしたら、右上のスマホのアイコンがある
場所をクリックします。

そうしたら、Responsiveのボタンをクリックします。

そうするとモバイルデバイスを選べるので
設定してみてください。

こんなに簡単にできるんです。

ブログ執筆のチェックに最適ですね!