css - 显示通过 Chrome 开发者工具所做的所有更改

标签 css google-chrome browser google-chrome-devtools

如何显示我使用 Chrome 开发者工具所做的所有更改?

示例:

  1. 打开一个网站。
  2. 打开 Chrome 开发者工具
  3. 更改标签的样式属性。
  4. 向一些 css 文件添加新样式。
  5. 更改 JavaScript 函数。

如何查看这些变化?像这样的东西:

    page.html:56 Change style attribute of foo to bar.
    page.css:21 Lines added: 21,22,23,24.
    page.js:12 Line modified.

最佳答案

从 Chrome 65 开始,有一个更改选项卡!!

是的,真的,太棒了:)

打开开发工具 > Ctrl+Shift+P > 显示更改

https://developers.google.com/web/updates/2018/01/devtools#changes

关于css - 显示通过 Chrome 开发者工具所做的所有更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25020526/

相关文章:

html - 删除 Bootstrap 导航栏上的顶部填充

CSS - 使用 :hover pseudoclass isn't working at the bottom of an anchor tag

javascript - 如何找出此 Chrome 扩展程序存储数据的位置?

android - (如何)我可以在没有网络字体的情况下仅通过 css 在浏览器中使用 native Android 字体吗?

css - 如何使菜单项在 flexbox 中水平显示

javascript - Safari 和 Chrome 中的跨域 AJAX 调用

ruby-on-rails - 导航器中的 ('serviceWorker')从文件读取时不返回 'true',否则为 true

javascript - 打印页面时执行javascript

c# - 尝试在 C# 的 ActiveX WebBrowser 中设置/获取 JavaScript 变量

html - "width=device-width"适用于 iPhone 但不适用于 iPad