web-dev-qa-db-ja.com

iPhoneのデバッグ時にSafariWebインスペクターに要素とスタイルパネルが表示されない

IPhoneをMacに接続し、iPhoneの詳細設定でWeb Inspectorを有効にしました。これにより、Mac Safariでページを表示できますが、Safariで要素とそのスタイルを検査できません。要素パネルまたはスタイルパネルが表示されません。

IPhoneでテストしているページ要素に適用したスタイルをデバッグするためのパネルを見つけるのを手伝ってくれる人はいますか?デスクトップサファリページのデバッグでこれらのパネルを見ることができます。スクリーンショットを見る enter image description here

助けてくれてありがとう。

9
Mohamed Hussain

答えはです。スクリーンショットのように、ドロップダウンからDOMツリーを選択する必要があります。 enter image description here

0
Mohamed Hussain

Webインスペクターから任意のhtml要素を選択します。これで、デバイスでは青色で強調表示されます。右上隅にスタイル、レイヤー、Nodeタブを表示するための拡張ウィンドウがあります。スタイルを選択してCSSを編集してください。詳細については、コメントに記載されているリンクを参照してください。 enter image description here

11
Gobi M

Safari 11.1.2では、[計算済み]タブを選択すると、計算済みプロパティの横にある矢印をクリックして、計算されていないプロパティ(スタイル属性)レベルに戻ることができます。たとえば、添付のスクリーンショットの-webkit-border-horizontal-spacingプロパティの横にある灰色の矢印を参照してください。

Safari Element Inspector Computed properties sidebar

3
Jamie Birch

これは私にとっても信じられないほど苛立たしいことでした。小さなサイドバーアイコンです small sidebar icon 右上にあり、要素タブが開いています。

前:

before

後:

after

3
Jack Howard