ホーム   WEBデザイン   Chromeでデバイスごとの画面サイズチェックできるWindow Resizer。

 WEBデザイン    2,553

 

Chromeでデバイスごとの画面サイズチェックできるWindow Resizer。

このエントリーをはてなブックマークに追加

ChromeユーザーでなおかつWEBデザイナーであれば、この機能拡張は必須でしょう。レスポンシブをチェックするのに「Window Resizer」が便利です。

スポンサーリンク

Chromeでも各種デバイスのチェックが可能だが。。。

Chromeにもデフォルトでデベロッパーツールから各種デバイスでの表示のチェックが可能ですが、表示もモタツクし操作しづらい。

0

スポンサーリンク

拡張機能、Window Resizerをインストール。

そこでWindow ResizerをChromeにインストールしましょう。
まずはChromeを立ち上げ、Window Resizerのインストールのページへ。

「+CHROMEに追加」をクリック

1

「Window Resizerを追加しますか?」というダイアログが出てきますので、拡張機能を追加をクリック。

2

Window Resizerが追加されました。右上のWindow Resizer(NEWアイコン)をクリック。

3

「BETAバージョンにトライしてみて」っつうアラートが出てきますが、無視して「OK, got it!」をクリック。

4

すると各デバイスに切り替えるナビゲーションがでてきます。下の方にある「Edit presets」をクリックしてみましょう。

5

ここにAdd new resolutionを追加しておくことも可能です。よく使うサイズは予め登録しておきましょう。

6

スポンサーリンク

 

Twitter でbbpをフォローしよう!

コメント

このエントリーをはてなブックマークに追加

プロフィール

bbb

bbpはWEBデザインと輸出入の仕事をしてます。趣味程度のブログです。キュレーションへの投稿、ページのいいねとシェアに喜びます。