powerdesigner显示工具面板_谷歌浏览器 Chrome 86开发工具更新

010c70837691fe2762c18833a9e2e8c1.png

将于2020年10月6日发布的Google Chrome 86将具有开发工具的更新版本。此更新引入了新功能,扩展了该工具的实用性。发布者将能够在易于访问的新媒体面板中调试视频,可以访问更多仿真器,并利用从Lighthouse到6.2更好的审核优势。

新媒体面板视频调试器的屏幕截图

c7baf9c52c8bbedd08456e522a68596c.gif

新媒体面板

Chrome开发者工具现在具有媒体面板,可让您调试视频。

有关如何访问媒体面板的分步说明:

  1. 单击显示更多选项的三个点。
  2. 选择更多工具
  3. 选择“媒体”以显示新的视频调试器工具。
63530ea2f9abb70da59888989bd076b0.png

新的媒体面板允许您检查属性,事件,消息和时间轴。

7eac3bbcb88d8427e1855beea725a2ed.png

根据Google的说法:

““属性”选项卡显示媒体播放器的属性。单击事件选项卡以查看所有媒体播放器事件。单击消息选项卡以查看媒体播放器消息日志。您可以按日志级别或字符串过滤消息。在“时间轴”选项卡上,您可以实时查看媒体播放和缓冲区状态。”

捕获节点屏幕截图

现在,您可以通过“元素”面板中的上下文下拉菜单来获取特定节点的屏幕截图。

36f3589ca389d445660bdc4b98fb4eef.png

模拟缺少的本地字体

启用后,此功能将忽略计算机上的字体,并表现为缺少字体。这将导致开发工具像新访问者一样获取字体,从而使您可以调试过程。

模拟偏好减少的数据

此设置可以模拟具有为数据保存模式设置浏览器首选项的网站访问者。然后,按偏好减少数据的CSS媒体查询可以显示较小的图像。

f2c17ad20a3059fa0aba3d67b9f145f0.png


这是一项实验功能。

W3c注意到有关此功能可用于识别低收入用户的担忧。

从Chrome 85开始,包括基于Chrome的Microsoft Edge,将支持此媒体查询。

通过启用此仿真,发布者可以查看和调试这些情况下的网页行为。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值