选择元素：如果开发中预期的样式效果没有出现，可以拾取某个元素，在 样式
选项卡中查看样式的具体信息，包括继承的样式、被覆盖的样式和计算|渲染出来的最终样式信息；在
已计算 选项卡中可以查看完整的样式；根据检查情况修改并更新项目
切换设备：在移动端和桌面端切换，特别是响应式开发要切换到移动端
Element：检查文档/元素结构
[] 偷图片
[] 偷视频
Console：查看控制台输出；开发过程中，逻辑相关的部分，请多使用 console.log() 调试
[] console.log() 基本使用
无须拼接
console.log('a', a, 'b', b, 'c', c );
console.log({ a, b, c });
测试代码运行时间
console.time('timer')
for (let i = 0; i < 1000; i++) {
//不要嵌套使用console，会导致计时增加
}
console.timeEnd('timer')
Network：网络情况，各种资源图片、样式文件等加载情况
[] 偷音频
Local Storage：本地存储
Security：安全等信息
. 开发应严格遵循设计稿；更多细节，请访问
UI 设计稿验收
. 本着移动优先的原则，通常要查看项目在真机上的效果，所以真机调试的步骤必不可少[除非明确项目的定位就是桌面端]
1. 环境需求
. 插件需求：Live Server
. 网络需求：开发电脑和手机链接同一个 WiFi | 同一个域
2. 环境配置
2.1. 查看本机IP地址；按 Win+R，打开命令运行窗口，输入 CMD，打开控制台/小黑屋，输入 ipconfig，查看本机 IPv4 地址；或者按 Win+I，打开系统设置，在网络的本地连接中查看网络信息
C:\Users\cnplaman>ipconfig
Windows IP 配置
以太网适配器 VMware Network Adapter VMnet1:
//VMware
以太网适配器 VMware Network Adapter VMnet8:
//VMware
无线局域网适配器 WLAN:
连接特定的 DNS 后缀 . . . . . . . :
IPv6 地址 . . . . . . . . . . . . : 2408:8220:3434:3330::2
IPv6 地址 . . . . . . . . . . . . : 2408:8220:3434:3330:f2c:629f:80e4:3bee
临时 IPv6 地址. . . . . . . . . . : 2408:8220:3434:3330:dc54:f31f:ae4f:643e
本地链接 IPv6 地址. . . . . . . . : fe80::62d7:b476:7de2:1bef%8
IPv4 地址 . . . . . . . . . . . . : 192.168.1.3
子网掩码 . . . . . . . . . . . . : 255.255.255.0//here
默认网关. . . . . . . . . . . . . : fe80::1%8
192.168.1.1
以太网适配器 蓝牙网络连接:
//Bluetooth
C:\Users\cnplaman>
2.2. 打开 Vs code，点击右下角管理按钮 ，选择设置 setting，或者直接按 CTRL+,
2.3. 选择扩展 Extension 里的 Live Server Config，修改主机 host 为查询到的IPv4地址
2.4. 重新启动 Vs code
3. 真机调试
. 使用 Open With Live Server 打开浏览器
. 在浏览器的页面中，右键单击 → 为此页面创建QR代码，打开一个二维码，使用手机扫码，即可在手机端预览页面效果
真机查看效果时，不需要每次扫码，手机端页面不要关闭即可保持实时更新
按 Win+I 打开系统设置，在网络属性中查看 IPv4 地址
Lighthouse 是一个开源的自动化工具，用于改进网络应用的质量
是 Chrome 扩展程序： 检查 → Lighthouse
对HTML页面运行一连串的测试，生成一个有关页面性能的报告
参考失败的测试，采取措施改进应用
[] 结合浏览器的调试功能，指出下列代码片段的问题
<nav id="main" id='nav'>
<ul class="nav-wrap'>
<li class="logo main">
<img src="./imgs/1.jpg">
</li>
<li style="color:#f40">item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
<li>item5</li>
</ul>
</nav>