iPhoneやiPadなどのiOS端末上で表示中のHTMLやCSSのソースコードを、MacのSafariで表示する方法をご紹介いたします。

1. Safari の設定

スクリーンショット 2015-11-13 17.28.12

Safari -> 環境設定 -> 表示されるポップアップの詳細を選択して-> メニューバーに”開発”メニューを表示 をチェックして下さい。

  1. iOS端末の設定

thumb_IMG_3772_1024

  • USB経由でMacにiOS端末を接続します。

  • iOS端末で 設定 -> Safari -> 詳細 -> WebインスペクタをONにして下さい。

  • 端末のSafariでアクセスする。

  1. ソースコードの表示

スクリーンショット 2015-11-17 16.29.45

表示するページを選択したら、 開発 -> 端末名 とすると、実際のデバイス上のコードが表示されます。選択中のタグはハイライトで表示されます。

スクリーンショット 2015-11-17 16.34.19

以上です。

 

★会社紹介★

私達bravesoft(ブレイブソフト)は「最強のものづくり集団」を目指し、
新しいものへの果てしない挑戦を日々繰り広げております!
その中で一緒に働いてくれる仲間も積極採用中ですので、是非お問い合わせください!

<基本情報>
bravesoft オフィシャルホームページ
採用情報
受託開発紹介
UI/UXデザイン紹介

<自社事業>
eventos
Live!アンケート
Appvisor Push

投稿者プロフィール

Ha Thi Hong

Ha Thi Hong