Chrome Devtools 不保存我在 CSS 源面板中所做的更改

Question

我的文件存储在本地；我将.paragraph 类的颜色从#FFF 更改为#97a4b4；我按下CTRL+S，我的CSS文件旁边的asterisk(*)消失了；

如果我在页面上按F5 并重新加载，更改不会保存，颜色会返回到#fff；

这是一个错误吗？

如果我在 Chrome devtools 的元素面板中编辑元素的宽度，我想将其保存在原始的 *.php 文件中；

我怎样才能达到这个效果？

Answer 1

第 1 点

为了能够在 Chrome DevTools 中编辑（本地）源文件，需要：

1.将项目文件夹添加为工作区（DevTools - 设置 - 工作区 - 添加文件夹）

2.在Elements左侧面板中右击将webserver提供的源文件映射到本地文件。

（这对我来说似乎有些多余，因为我打开的站点已经来自本地文件夹。）

更多关于这里的主题： https://developers.google.com/web/tools/setup/setup-workflow

仍然缺少第 2 点的答案

我需要一种简单的方法在 Devtools 中通过选择站点上的项目、编辑 DOM 中的 html 并（以某种方式）保留更改来在 DOM 中找到项目后编辑 html。 在我的 *.php 文件中缺少一个指向它的快速方法，该文件现在映射到 Sources 树中，所以我不必滚动年龄（并使用 CTRL+F）直到找到它；

这可以在 Chrome 之外的我的文本编辑器中完成（缓慢的方式），因此映射的本地文件夹对于这个工作流程来说是多余的。