Safari Web 检查器在调试时不显示元素和样式面板 iPhone

Safari Web Inspector not Showing elements and Style Panel when debugging iPhone

我将 iPhone 连接到 mac 并在 iPhone 高级设置中启用了 Web Inspector,能够在 mac safari 中查看页面但无法检查任何内容元素及其在 safari 中的样式。我没有看到元素面板或样式面板。

任何人都可以帮我找到那些调试样式的面板,我将它们应用于我在 iPhone 中测试的页面元素。我能够在调试桌面 safari 页面时看到这些面板。看截图

在此先感谢您的帮助。

来自 Web 检查器 select 任何 html 元素。现在在设备中它将以蓝色突出显示。右上角展开 window 以显示样式、图层、节点选项卡。 Select 样式和编辑 css。有关完整详细信息,请参阅评论中给出的 link。

答案是,需要 select 下拉列表中的 DOM 树,如屏幕截图所示。

在 Safari 11.1.2 中,选择 'Computed' 选项卡后,您可以通过单击任何计算属性旁边的箭头返回到非计算属性(样式属性)级别。例如,请参阅我所附屏幕截图中 -webkit-border-horizontal-spacing 属性 旁边的灰色箭头。

2021 年 7 月更新:

是的,使用 Safari Technology Preview 的另一个答案也适用于我:https://developer.apple.com/safari/technology-preview/

我在 Big Sur 上使用 Safari 进行调试失败:版本 14.1.1 (16611.2.7.1.4)

我在 Big Sur 上使用 Safari 技术预览进行调试:Release 128 (Safari 15.0)


这也让我非常沮丧。它是最右上角的小边栏图标 ,元素选项卡打开。

之前:

之后:

如果您在 2021 年遇到此类问题,请下载并使用 Safari Preview 而不是常规的 Safari

我遇到以下配置问题:

  • MacOS Big Sur 11.4
  • Iphone 10 iOS 14.6

干杯!

嗯,这是 Mojave 之后 Catalina 和 BigSur 更新中的正常问题。或者,如果您要将 MacOS 升级到更高版本。我希望我们不要进入蒙特雷! 我推荐下载 - Safari 技术预览 -

BigSur - Download

无论你一直在使用什么。

如果你面对的是其他低版本 - try from here