Warning: "continue" targeting switch is equivalent to "break". Did you mean to use "continue 2"? in /home/users/1/attlabo-ssl/web/buchiko-web.com/wp-content/plugins/all-in-one-seo-pack/modules/aioseop_opengraph.php on line 844
Google Chromeでスマホ表示の確認をする方法 | ぶちろぐ

アラサー主婦のWEBデザイン奮闘記

Webデザイン Web制作 制作お役立ち

Google Chromeでスマホ表示の確認をする方法

投稿日:

スマホでの表示を確認したい時、わざわざスマホを出して検索して…とやっていると結構面倒ですよね。

そんな時は、Google Chromeを使うとパソコンで簡単にスマホの表示を確認することができるんです。

では、その使い方について早速ご紹介していきたいと思います!

 

Google Chromeでスマホの表示を確認する方法

1.ページ内で右クリック → 検証

 

2.デバイスツールバーのアイコンをクリック(ショートカット:command + Shift + M)

 

 

するとスマホ画面の表示に切り替わりました!

 

4.「Responsive▼」をクリックして、確認したいスマホ端末を選択をします

 

検証を終えたい時は、右上の×マークをクリックすれば終了することができますよ。

以上、簡単にですがGoogle Chromeでスマホ表示を確認する方法をご紹介しました。

よく知られているツールだとは思いますが、まだ使ったことがないよという方はぜひこの機会に使ってみてくださいね。

 

 

-Webデザイン, Web制作, 制作お役立ち

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

なぜWebデザイナーを目指したのか

    私がWebデザイナーを目指そうと思ったのは、前職で飲食店スタッフをしていた2017年の頃です。 前職でもそれなりに楽しく働いていたのですが、どこかでずっと、手に職をもった職人や技術者に憧れてい …

【Photoshop】画像の白い部分だけを透過させたいときの方法

今回は、Photoshopで画像の白い部分だけを透過させたいときの方法についてご紹介します。 ダウンロードした素材を切り抜いて使いたいときなど、この方法を使えば簡単に行うことができるのでおすすめです。 …

いくつ知ってる?和柄の名前と意味10選

  日ごろ何気なく目にしている和柄ですが、その名前や意味を知っている人は少ないんじゃないでしょうか。 とくに和風のデザインを作るときなんか、「あれ、あの模様の名前なんだったっけ…」ってなった …

使える背景フリー素材サイト6選!

デザインの背景画像で迷ったときにチェックしたい背景素材サイトをまとめてみました! なんかデザインが物足りないな〜なんて時にも使えるサイトばかりなので、よかったら参考にしてみてください。 それでは、さっ …

スタイリッシュなSVGイラストが揃った素材サイト

こんにちは、ぶちこです。 今回はスタイリッシュなサイトにぴったりな、SVG形式のイラストが揃った素材サイトを2つご紹介します。 どちらも商用利用OKのサイトなので、安心して利用できますよ〜! &nbs …