【问题标题】:Is it possible to see all edited styles in Firefox developer tools?是否可以在 Firefox 开发人员工具中查看所有已编辑的样式?
【发布时间】:2018-12-05 04:38:08
【问题描述】:

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

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

在某个地方我可以看到所有我使用 Inspector 编辑过样式的地方(包括添加新规则),以便我可以一次复制它们?

【问题讨论】:

    标签: css firefox firefox-developer-tools


    【解决方案1】:

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

    【讨论】:

    • 是的!这只是我正在寻找的信息。希望这个功能能尽快进入稳定的 Firefox。
    • 是的,这确实会随 Firefox 65 一起提供,上周刚刚在 Nightly 中发布,本周即将达到 Beta 版。因此,如果您下载 Nightly 或 Beta,您将拥有新的 Changes 面板(实际上无需再设置 devtools.inspector.changes.enabled,现在默认情况下可见)。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-08-30
    • 2014-02-28
    • 2016-01-22
    • 1970-01-01
    • 2015-10-23
    相关资源
    最近更新 更多