如何在浏览器中查找注入样式表的来源

问题

发现 li 标签前的圆点不显示了,通过查看样式,发现 li 标签的样式被 注入样式表 修改了。

/images/posts/如何在浏览器中查找注入样式表的来源/1.png
(图1)

关于 用户代理样式表注入样式表 的定义:

  • 用户代理样式表:是由浏览器本身提供的默认样式集合。每个浏览器都有自己的用户代理样式表,它为 HTML 元素定义了一套基本的样式规则,确保即使网页没有提供任何自定义样式,页面也能以一种基本可读的方式呈现。
  • 注入样式表:指由网页开发者或第三方工具动态插入到网页中的 CSS 文件或内联样式。它可以是通过 <link> 标签引入的外部样式表、通过 <style> 标签定义的内部样式,或者是通过 JavaScript 动态添加的样式规则。

排查方式

方式一:禁用所有扩展

禁用所有扩展后,发现样式恢复了,那么确定是插件的问题,接下来做的就是逐步缩小范围。

/images/posts/如何在浏览器中查找注入样式表的来源/2.png
(图2)

方式二:使用隐身模式

默认情况下,当您以隐身模式打开页面时,浏览器 会禁用所有扩展程序。 因此,以隐身模式打开页面是检查扩展是否导致问题的快速方法之一。 但是,如果您允许扩展在隐身模式下工作,那么扩展也会继续在隐身模式下注入样式表。

方式三:检查网络下的域

/images/posts/如何在浏览器中查找注入样式表的来源/3.png
(图3)

0%