&tag(Safari);
*目次 [#b8e5fa81]
#contents
*参考情報 [#a111a9a3]

*Webインスペクタ [#b3a4b6b5]

**設定 [#c3933066]
-[Safari > 環境設定 > 詳細]で、[メニューバーに"開発"メニューを表示]にチェック。
-[開発]メニューが表示されるのでそこからいろいろ実行する。
-Webインスペクターは[開発]メニューから選択するか、OPT+CMD+Iで実行する。

**使用方法 [#bae90ecd]
***基本 [#c5713c0e]
-Chromeのデベロッパーツールと同じにように使える。
***要素の確認 [#p82c9396]
-インスペクタの表示を[DOMツリー]に変更し、そこから要素を選択する。
-もしくはWebインスペクタ中央ペインの右上にある"指"のマークを選んで、Web画面から選ぶ。
-CSSは一番右側のペインにある右から2つ目のところの"{}"を選ぶ(計算済みのスタイル)。


**モバイル用サイトのデバッグ [#jd202a02]
-iPad/iPhoneのSafariの設定で[詳細 > Webインスペクタ]をオンにする。
-iPad/iPhoneのSafariで適当なページを閲覧。
-MacのSafariで、[開発 > iOSシミュレーター]を選択。
-Webインスペクタが開くので使う(指のほうは使えないかも)。
-iPhone/iPadをUSB接続すれば実機でもいけるらしい。

トップ   編集 差分 履歴 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS