在Chrome的检查器开发人员工具中添加新的空白样式表的最快方法（“Inspector样式表”）

Question

通常，当我想在Chrome中测试CSS修改时，我会使用：

• 右键单击＆gt;检查

• 使用右下方的面板，使用+按钮添加新类，然后在那里进行编辑。

  

但我注意到甚至有一种更方便的方法：打开一个“Inspector样式表”，打开一个空白的CSS文档，可以编辑，并实时显示修改：

问题：在Google Chrome中打开此类“检查器样式表”最简单/最快捷的方式是什么？

（最快，我的意思是比右键单击更快，检查，+添加新类，点击小检查器样式表链接等。）

我无法在Chrome控制台/开发者工具的菜单中找到它。 是否有键盘快捷键可以打开这样的“Inspector样式表”？

Answer 1

我没有一条简单的快捷方式，但我能让你快点到达那里：

1. F12 打开DevTools。
元素选项卡上样式面板顶部的
2. 按钮，用于创建检查器样式表。
3. 双击以打开。

创建一个inspector-stylesheet，然后关闭它或关闭DevTools，如何再次找到它？

• 如果您在检查器样式表仍处于打开状态时关闭了DevTools，只需直接转到 Sources 选项卡（在DevTools，topbar中），并且检查器样式表仍应打开。
• 如果您已关闭检查器样式表本身，则在来源标签上，按 Ctrl + P 并输入＆＃34; inspector-stylesheet＆＃34; ，通常在＆＃34; in ...＆＃34; 之后，您已经看到了检查员样式表建议的顶部 - 可用文件列表。
  它还应该仍然显示在 Elements 选项卡上样式面板的顶部，您首先在其中创建它。