Chromeの標準機能でサイトのスマホ表示をエミュレートする

公開日: : 最終更新日:2016/12/11 パソコン関連 ,



SPONSORED LINK



iPhone機種やAndroid機種のブラウザ表示をアドオンやプラグインを入れる事なくChromeの標準機能で出来ます。
レスポンシブサイトの作成の確認にはとても便利でした。



SPONSORED LINK



Chromeの要素検証から設定する

スマホのエミュレート表示まで手順は4つ

まずChromeからスマホ表示したいサイトを開き
[右クリック]>[要素の検証]を選択します。

Chromeでスマホ表示-要素の検証

[>三]みたいなマークを選択するか
[esc]を押すとコンソールのタブ表示がでます。

Chromeでスマホ表示-コンソール表示

コンソールタブの表示の並びにある[Emulation]を選択。
エミュレートしたい機器を選択します。iPhone5にしました。
[Emulation]を選択したら表示が変わります。

Chromeでスマホ表示-エミュレーションしたいスマホを表示

まだ画面がPC表示のままなら一旦更新すると設定は終了です。
画面サイズも表示もiPhone5のものになりました。

Chromeでスマホ表示-設定完了

スマホ表示のエミュレートできる機器の種類はたくさんある

Chromeでスマホ表示-iPhone5のエミュレーションも出来る

まとめ

画面の大きさまでエミュレートできるのが素晴らしい。
iPhone5ですとRatina表示も確認できて機能は十分すぎ
なんでスマホ表示するアドオンないのかと思ったら標準でついてたってことでした。
ちょっと手順が多いけど覚えておいたら
スマホサイトとかログインできたりしてなにかと便利でした。

Sponsored Link
◆RECOMMEND◆

関連記事

REX-WIFIUSB2を使ってUSBHDDをネットワークドライブ化する

ネットワークドライブを一台も持っていないんですが 以前購入した。REX-WIFIUSB2でUSBハ

記事を読む

Mac OS Xはデスクトップ画面の動画撮影が簡単だった。

Mac標準のQuickPlayerを使っての 画面の動画キャプチャが出来ることを知り早速利用 艦

記事を読む

リモートデスクトップ中のWindows10シャットダウン・再起動方法

リモートデスクトップ中のWindows10を再起動やシャットダウンします。 スタートボタンから電源

記事を読む

MacOSXからWindowsへリモートデスクトップする方法

前回はWindows10HomeでRDP接続ホストにする方法ですがMacからMicrosoft純正の

記事を読む

[Mac]VMwareでWindows8Pro(64bit版)をインストールした。

VMware5 FusionにてWindows8Pro(64bit版)インストール完了しました。

記事を読む

ワードプレスの画像最適化して表示を高速化くれるプラグイン

今回ご紹介の『EWWW Image Optimizer』プラグイン いままでアプロードした過去の画

記事を読む

REX-WIFIUSB2で色々始めました。これはすごい!

ラトックシステムのREX-WIFIUSB2(ホワイト)を購入。 Wi-Fiのリピーター機能もあり

記事を読む

windows10のプログラムの関連付けを解除する

前回はプログラムの変更でしたが今回は関連付けの解除です。 アプリの関連付けを変更ならす

記事を読む

FC2ブログに一括でファイルをアップロードするAppleScript

FC2のファイルアップロードが5つまで同時に対応するようになったのですが それ以上のファイルをアッ

記事を読む

MacでSDカードにRaspberryPiイメージを書き込む

kevinpartner / Pixabay[/caption] MacのターミナルでSDカ

記事を読む

no image
[UWSC]楽天マーケットスピードとRSSのログイン自動化と終了

UWSCは管理者権限で実行しておく マーケットスピードのログインIDは

[Python]アクセント符号を消す処理のメモ

Pythonでアクセント符号の付いた文字をアルファベットへ置き換えをし

MacでSDカードにRaspberryPiイメージを書き込む

kevinpartner / Pixabay[/caption]

SDカードをフォーマットする方法

SDカードのフォーマットは専用以外のフォーマットツールを使うと性能が落

MacでPHPファイルを簡単に確認する方法[メモ]

PHP5.4以降の場合のみ $ php -v でphpのバ

→もっと見る

  • 管理人
    サイト名:ぽけっとろぐ

    カバンやポケットでひっそり活躍してくれるガジェットが好き。
    写真は猫カフェで撮影
    RSS / Twitter / Facebook
PAGE TOP ↑