Google Chrome™ デベロッパーツールで表示できないスマホ画面を確認するためには、「mobile browser emulator」を使用

デザイン ＞ モバイルデザイン

問題発生

　状態:- 　閲覧数:2,328 　投稿日:2015-12-27 　更新日:2015-12-27
Google Chrome™ デベロッパーツールでスマホ画面を表示できないURLに遭遇

解決策


Chrome ウェブストアより、Chrome拡張機能をインストール
・mobile browser emulator
With this extension for Google Chrome web developers can test mobile, and in particular responsive, web pages on their desktop

試してみたけれとも期待した効果を得られなかった拡張機能


特定URL(例えばユニクロ)に対して効力を発揮しない拡張機能一覧
・FireMobileSimulator for Google Chrome™
・smartphone simulator
・User-Agent Switcher for Chrome

モバイル対応サイトリニューアル仕様案

モバイルデザイン6 ／ フォーム



類似度ページランキング
順位 ページタイトル抜粋 ％
1 Google Chrome™ デベロッパーツールで表示できないスマホ画面を確認するためには、「mobile browser emulator」を使用 69
2 デフォルトの「Google Chrome」ではURL欄にwwwが表示されないため、「Microsoft Edge」を使用する 49
3 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない 41
4 ChromeでTwitter画像をクリックした際、拡大(原寸画像以上)表示しないようブラウザ側で指定するため、Chrome 拡張機能「Stylus」を使用しました。 38
5 ページで使用されている「id名」「class名」をChromeで取得したい 　 37
6 「文春オンライン」に掲載されている画像を「Google Chrome」ブラウザでダウンロードするためには、chrome拡張機能「Absolute Enable Right Click & Copy」を使用します。 37
7 「Google Chrome」を再起動するためには「chrome://restart」へアクセスします。 37
8 「Google Chrome を起動後、100%の確率で3分以内に落ちる」場合は、アンインストール後インストールし直すしかない 36
9 「レイアウト崩れ」がどうしても解決しない → Chrome「デベロッパーツール」で怪しいと思った要素を、正常表示されるまで削除し続けていく 36
10 「:after擬似要素」は、Chromeの「要素を検証」で確認できない 35
11 CSS3-mediaqueries.jsは、@ importスタイルシートに記述した内容を反映しない 34
12 「Twitter Bootstrap」のアイコンは、画像なので色を変更できない 34
13 Chromeでリンク先ページを常に別タブで開くためには、「Ctrlキーを押しながらクリック」 33
14 「Webページへのリンク」をクリックした際、Chrome起動オプションを適用させるには、レジストリを書き換えるしかない 33
15 ボタンクリックした際、テキスト選択状態になるのを防止するためには、「user-select: none;」 33
16 「Google Chrome」ブックマークをフォルダー単位で、「ドメイン毎」「追加日昇降順」に並べ替える拡張機能「Sortmark」 33
17 Illustrator で文字を見た目通りSVG出力するためには、「アウトライン作成」処理が必要 33
18 ページ内リンクの位置を微調整するためには、Negative margin を使用する 33
19 「Google Chrome」タブをグループへ追加すると、そのタイミングでグループは自動的に開かれてしまいます。開かないようにすることはできません 33
20 「Illustrator CS3」 で「SVG トリミング出力」するためには、「トリムエリアツール」ではなく「アートボードの大きさ」を「オブジェクトサイズ」へ変更した後出力 33
2026/6/05 11:39 更新
週間人気ページランキング ／ 5-29 → 6-4
順位 ページタイトル抜粋 アクセス数
1 RGBの種類 ／ ビットカラー | RGB(色) 4
2 鉄道会社毎のカラーコード | カラーコード(色) 3
2 キャラクター無料作成ジェネレーター ／ FLASH ／ オンラインサービス | イラスト参考(デザイン) 3
2 「属性」「プロパティ」「アトリビュート」の違い | CSS 3
3 画像縦横比の問題 | 画像 2
3 「要素{position:absolute;}親要素{position:absolute;}」と「要素{position:absolute;}親要素{position:relative;}」の違い | position(CSS) 2
3 アニメーション カテゴリー 2
3 レスポンシブ カテゴリー 2
3 CMY 2
3 CSSだけで、任意の要素に配置した画像を画面一杯に表示することは、基本的には出来ない。「img src」「背景画像」「div要素」何れの場合でも。可能なのは、特殊な要件が重なった場合だけ | CSS 2
3  全体基準となるhtmlタグへのfont-size指定案 2
3 「東京都」のカラーコード取得は難しい | カラーコード(色) 2
3 RGB ／ 24ビットカラー 2
4 最初に疑ったこと 1
4 ｢レイヤー」＋「レイヤー効果」をコピーして新規psdにペースト | Photoshop 1
4 方式1.色相H0°～360°、輝度L0～100(固定) 1
4 「テキストリンク」と「ボタン」の使い分け 1
4 Chromeはアホなコ | Google Chrome(ブラウザ) 1
4 _notesフォルダ削除 | Dreamweaver8(Dreamweaver) 1
4 font-size | フォント 1
2026/6/5 5:05 更新