• 原文地址：5 lesser-known features of Chrome Devtools
• 原文作者：Manan Tank
• 译文出自：掘金翻译计划
• 本文永久链接：github.com/xitu/gold-m…
• 译者：贺雪
• 校对者：calali Xiny

5 个鲜为人知的 Chrome 开发者工具的特性

1. 切换类名

跳转到 .cls 选项卡，可以进行类名的切换

2. 滚动到视图

你是否在查看 HTML 源码的时候无法定位至页面上的对应元素？嘿，只需要滚动到视图就可以了！

3. 创建并运行代码段

你是否想运行一些 javascript 代码，但是碍于内容太多，把它粘贴到控制台会感觉很奇怪吗？嘿，你其实可以创建代码段，然后运行它！

4. 添加类名和自动建议

当您使用 .cls 选项卡添加类名时，它会联想一些已存在CSS中相似的类，以便于你将他们快速进行比较

5. designMode

使用 designMode，你可以直接编辑所有内容

先这样吧，伙计们!

希望你能找到一两个新玩意儿来改进你的开发者工具的工作流程。干杯！

如果发现译文存在错误或其他需要改进的地方，欢迎到 掘金翻译计划 对译文进行修改并 PR，也可获得相应奖励积分。文章开头的 本文永久链接 即为本文在 GitHub 上的 MarkDown 链接。

掘金翻译计划 是一个翻译优质互联网技术文章的社区，文章来源为 掘金 上的英文分享文章。内容覆盖 Android、iOS、前端、后端、区块链、产品、设计、人工智能等领域，想要查看更多优质译文请持续关注 掘金翻译计划、官方微博、知乎专栏。