PC版のGoogleChromeでスマホ画面を表示。スマホエミュレーター

ブラウザの簡単な設定で、iPhoneやAndroidスマホ、WindowsPhoneの画面を表示されることができます。
Webページを作ったり、ブログを書いていると、スマホからどのように見えるか、スマホ実機を起動して見え方を確認したいときがあります。
スマホ画面は、パソコンの画面上で確認することもできます。

 

Google Chromeには、開発者用のツールが用意されており、簡単に設定し、スマホ画面を表示させることができます。

手順
1. ツール > その他のツール > デベロッパーツール
または、Ctrl+Shift+I

PC版GoogleChromeスマホエミュレーター設定

2.開いた「Developer tools」画面の左上のスマホ画面のアイコンをクリックします。

PC版GoogleChromeスマホエミュレーター設定2

 

3.Webページに戻り、Responsiveをクリックし、表示させたいスマホ端末を選択します。ます。

PC版GoogleChromeスマホエミュレーターPC画面でスマホ機種選択

Editをクリックすると、その他の端末を選ぶことができます。

PC版GoogleChromeスマホエミュレーター別の機種のスマホを選択

開いたスマホ画面から、リンクなどのクリック操作ができます。
リンク先の表示も設定したスマホ画面の表示になります。