如何在Chrome开发者工具中快速打开Inspector stylesheet？

嘿，作为天天和Chrome DevTools打交道的人，我太懂你想要高效操作的需求了！给你分享几个比右键操作快得多的打开空白Inspector Stylesheet的技巧：

• 命令面板快捷键大法（最快首选）

  1. 先按 F12 或者 Ctrl+Shift+I（Windows/Linux）/ Cmd+Opt+I（Mac）快速打开开发者工具
  2. 紧接着按下 Ctrl+Shift+P（Windows/Linux）/ Cmd+Shift+P（Mac）调出命令面板
  3. 直接输入 inspector stylesheet，在弹出的选项里选中「Create new inspector stylesheet」或者「Show inspector stylesheet」（取决于你之前有没有创建过），回车就能打开空白的实时生效样式表了

• Elements面板快速切换
  如果你已经在Elements面板的Styles标签页里，不用切面板：

  1. 找到Styles标签右上角的「+」按钮旁边的下拉菜单（默认显示当前页面的某个样式文件名）
  2. 直接在下拉列表里选择「Inspector Stylesheet」，瞬间就能切换到空白样式表开始编辑

• 重复访问快速入口
  一旦你创建过Inspector Stylesheet，它会常驻在Sources面板里：
  展开Sources面板左侧的「Inspector Stylesheets」文件夹，直接点击里面的样式表文件就能快速打开，适合频繁使用的场景

这种空白样式表真的是测试临时CSS的神器，修改实时生效还不会污染原项目文件，太香了！

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