css - 是否可以在 Firefox 开发人员工具中查看所有已编辑的样式？

Question

我首选的 CSS 工作流程（至少在调整现有 CSS 时）是使用 3 面板 Inspector 面板直接在浏览器中进行编辑，然后将编辑后的样式复制到我的样式表中。

有时我会编辑许多元素的样式并忘记我编辑了一些元素（因为您只能通过准确选择该元素并查找左侧带有绿色条的规则来查看它是否已编辑 AFAICT）。然后我将无法手动将该元素的样式更改复制到我的样式表中，并且在重新加载时会丢失更改。

有没有什么地方我可以看到我使用 Inspector 编辑样式的所有地方——包括添加新规则——以便我可以一次复制它们？

标签： cssfirefoxfirefox-developer-tools

Answer 1

目前仅在 Firefox Nightly 中可用。在about:config设置devtools.inspector.changes.enabled为真。这将在开发工具中创建一个“更改”选项卡，其中包含一个类似 Git 的面板，显示您的所有更改。