Chrome DevTools筛选CSS规则的键盘快捷键及访问方式咨询

Hey there! 我太懂你找这个快捷键的苦恼了——Chrome DevTools有些实用的小功能确实没在官方快捷键页面里显眼标注，不过这个CSS规则筛选的激活方法其实很简单：

• 核心隐藏快捷键：
  当你在Elements面板的Styles标签页时，直接按 / 键（斜杠），就能瞬间激活CSS规则的筛选输入框！这个小技巧很多人都不知道，官方文档也没把它放在显眼的位置。
• 备选通用快捷键：
  如果你习惯用全局搜索快捷键，也可以按 Ctrl+F（Windows/Linux）或 Cmd+F（Mac）——不过要先把焦点放在Styles面板的CSS规则列表里（比如点击任意一条规则），这样快捷键就会自动切换到CSS规则筛选，而不是全局页面搜索。
• 筛选使用小技巧：
  激活筛选框后，你可以输入选择器名称、CSS属性名（比如color）、甚至属性值（比如#ff0000），DevTools会实时过滤出匹配的CSS规则，帮你快速定位想要的样式。

如果还是没成功，检查一下是不是焦点不小心跑到了其他面板（比如Console），切回Elements面板的Styles标签页再试就好啦！

内容的提问来源于stack exchange，提问作者Jonathan002