☰

Chrome devtools 元素中的斜体是什么意思？

tag-icon • tag-icon css google-chrome-devtools
Chrome devtools 元素中的斜体是什么意思？

我正在查看该网站的汉堡菜单中的元素：

https://rainbowedit.com/

使用 Chrome devtools，Elements 中的 CSS 以红色斜体显示且不可编辑。这是什么意思？有没有办法让它们可编辑？

带有斜体 CSS 突出显示的 devtools

答案1

它似乎是使用某种在页面中注入的 JS 生成的 CSS。样式组件已知这样做，并且样式在开发工具中是只读的。

来源：无法在 Chrome 中编辑样式？

我想你可能在生产中看到了通过“快速模式”注入的样式。这使用了一个特殊的 DOM APIChrome DevTools 目前仅以只读方式显示。我们尚未设置安全出口来禁用此注入方法，但正在考虑中。

答案2

如果您在已打开 Chrome Dev Tools 的情况下重新加载该页面，某些样式似乎会发生这种情况。请尝试关闭 Dev Tools，重新加载页面，然后重新打开 Dev Tools，看看是否可以使它们可编辑。

答案3

在 Chromium 的最近几个版本中，我都遇到了这种情况。只有当我在 iframe 中编辑文件的 css 规则，然后重新加载 iframe 时才会发生这种情况。然后我就会看到锁定的斜体规则（仅适用于我编辑的规则）。

我不认为“快速模式”正在发挥作用。

我已经举报此行为@Chromium 漏洞

相关内容