首先启用Safari开发菜单，再通过右键或菜单打开检查器，最后可在响应式模式下调试元素。具体步骤：1. 打开Safari设置→高级→勾选“在菜单栏中显示开发菜单”；2. 右键网页元素选择“检查元素”；3. 通过开发菜单启动Web检查器查看DOM、样式等；4. 使用响应式设计模式模拟设备并实时检查盒模型与样式。
如果您在开发网页或调试网站样式时需要查看页面的具体结构，但默认情况下 Safari 浏览器不显示“检查元素”选项，可以通过启用开发菜单来实现对网页元素的深入分析。以下是启用并使用该功能的具体步骤。
本文运行环境：MacBook Pro，macOS Sonoma
一、启用Safari的开发菜单
开发菜单是 Safari 浏览器中隐藏的功能集合，包含网页检查、响应式设计模式等工具。启用后即可访问检查元素功能。
1、打开 Safari 浏览器，点击顶部菜单栏中的Safari，然后选择设置。
2、在设置窗口中切换到高级标签页。
3、勾选底部选项：在菜单栏中显示开发菜单。
二、通过右键菜单检查元素
启用开发菜单后，可以直接通过上下文菜单快速打开元素检查器，定位特定HTML节点。
1、在网页上想要检查的元素上单击鼠标右键（或按住 Control 键单击）。
2、从弹出菜单中选择检查元素。
3、Web 检查器窗口将自动打开，并高亮显示所选元素对应的 HTML 代码。
三、使用开发菜单打开Web检查器
若右键不可用或需全面分析页面资源，可通过开发菜单手动启动 Web 检查器工具。
1、点击顶部菜单栏的开发菜单。
2、选择显示网页检查器。
3、在检查器面板中，可浏览完整的 DOM 结构、CSS 样式规则、网络请求及 JavaScript 控制台信息。
四、在响应式设计模式下检查元素
该模式允许模拟不同设备屏幕尺寸，同时进行元素检查，适用于移动端适配调试。
1、点击开发菜单，选择进入响应式设计模式。
2、调整窗口大小或选择预设设备尺寸。
3、使用鼠标悬停并点击页面任意区域，Safari 将实时显示对应元素的盒模型和样式信息。
