如何在没有工作空间的情况下从Chrome保存CSS更改？

Question

我们设计师目前的工作流程是：

• 打开网页并编辑CSS
• 在问题中写下所有CSS更改

有没有办法让chrome保存CSS的'diff'并导出它而不使用工作区？

Answer 1

从Chrome 65开始，Local Overrides可以为此提供帮助。在chrome://version检查您的Chrome版本。如果您还没有65，则可以使用Chrome Canary。

1. 打开来源。

2. 点击本地覆盖标签。

   

3. 点击选择要覆盖的文件夹，然后选择目的地。

4. 在元素面板上的样式面板或来源面板中的编辑器窗格中进行更改。 Chrome会将更改的文件保存到指定位置。

陷阱!!!

• 元素面板上 DOM树所做的更改未保存。
• 当CSS规则的来源为HTML 中的<style>标记时，样式窗格中的更改都不会发生。至少在Chrome 65中。有传闻称这可能会在66中得到修复。

Answer 2

不确定这是不是你想要的，但......

您可以从检查器（ctrl + shift + I）编辑页面，完成所有更改后，只需单击左侧的样式表链接并复制所需的所有内容