为什么Web Inspector将用户代理样式表显示为“已锁定”状态。

Question

我认为展示这个问题的最简单方法是使用图片：

http://oi61.tinypic.com/r2s4f9.jpg

在Web Inspector中，我正在尝试更改display：block但它已被“锁定”。此外，我无法弄清楚源代码中的来源

Answer 1

它显示为已锁定，因为您无法使用DevTools直接编辑它。您必须覆盖用户代理样式表中的样式。

Answer 2

打开Safari Web Inspector并检查日志，并注意您正在使用的任何可以修改内容或将内容注入网页的浏览器扩展程序或内容拦截器（

我案例中的罪魁祸首是内容拦截器（iOS广告拦截器），它通过在某些CSS元素上强制用户样式表display:none来阻止页面上的元素。因此，Safari将其显示为＆＃34;锁定＆＃34;就像你的截图一样无法编辑/修改它。 Web Inspector＆＃39; Logs＆＃39;中出现了警告。 tab告诉我内容拦截器阻止了一个框架加载资源。

禁用内容拦截器会删除强制样式表，并修复了我的问题。