29

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

谁能帮我找到那些面板来调试样式，我将其应用于我在 iPhone 中测试的页面元素。我能够在调试桌面 Safari 页面时看到这些面板。看截图在此处输入图像描述

提前感谢您的帮助。

4

6 回答 6

50

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

我遇到了以下配置的问题：

  • MacOS 大苏尔 11.4
  • 苹果手机 10 iOS 14.6

干杯!

于 2021-06-15T03:52:45.030 回答
22

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)

这对我来说也非常令人沮丧。侧边栏小图标它是最右上角的小侧边栏图标，元素选项卡打开。

前：

前

后：

后

于 2019-07-11T17:56:10.850 回答
8

从 web 检查器中选择任何 html 元素。现在在设备中，它将以蓝色突出显示。右上角有展开窗口以显示样式、图层、节点选项卡。选择样式并编辑 css。有关完整详细信息，请参阅评论中给出的链接。在此处输入图像描述

于 2015-10-07T08:46:08.910 回答
7

In Safari 11.1.2, when the 'Computed' tab is selected, you can get back up to the non-computed properties (the Style Attributes) level by clicking the arrow beside any of the computed properties. -webkit-border-horizontal-spacing例如，请参阅我所附屏幕截图中属性旁边的灰色箭头。

Safari Element Inspector 计算属性侧边栏

于 2018-09-26T16:43:11.940 回答
1

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

BigSur -下载

无论你一直在使用什么。

如果您正面临其他较低版本的问题 - 请 从这里尝试

于 2021-07-09T10:37:36.773 回答
-3

答案是，需要从下拉菜单中选择 DOM 树，如屏幕截图所示。在此处输入图像描述

于 2015-10-07T11:46:53.173 回答