[Web制作]iPhoneサイトで表示崩れが発生した時、実機とMacを繋いでWebインスペクタ機能でデバッグする方法

こんにちは、霙(@xxmiz0rexx)です。 スマートフォンサイトを制作している時、たまーに困ることがあります。 それは、実機でしか再現しない表示崩れ。 Macでみた時は大丈夫だったのに、何故かiPhoneでは謎の余白が…なんてことが先日もありまして、 解決のためにSafariのWebインスペクタ機能を使ってみましたので使い方をメモしたいと思います。 Webインスペクタ機能とは iPhoneで見ているページのソースをMacで見ながらデバッグできる機能です。 使うには双方へのちょっとした設定と、お互いをケーブルで繋ぐことが条件。 みんなだいすきGoogle Chromeの開発者ツールと同じようなものですね。 必要なもの 1.Mac 2.iPhone 3.ケーブル 次の章で使い方を書いていきたいと思います。 Webインスペクタ機能を利用する手順 1：iPhoneとMacをケーブルで繋ぐ まず

[roppara]

これはいいな

[s99e209]

iPhone実機で表示しているウェブサイトの検証をMACと接続して行う「Webインスペクタ機能」 ･･･ そういえばこの検証方法、まだ試したことなかった。実機確認が楽になるはず･･･！