Chrome开发者工具中出现了其他CSS？

Question

我在Chrome浏览器中打开的每个网站，包括我自己编写的网站，在开发者工具中查看时，都有以下HTML / CSS。

<style>
.tb_button {padding:1px;cursor:pointer;border-right: 1px solid #8b8b8b;
     border-left: 1px solid #FFF;border-bottom: 1px solid #fff;}
.tb_button.hover {borer:2px outset #def; background-color: #f8f8f8 !important;}
.ws_toolbar {z-index:100000} .ws_toolbar 
.ws_tb_btn {cursor:pointer;border:1px solid #555;padding:3px}   
.tb_highlight{background-color:yellow} .tb_hide {visibility:hidden} 
.ws_toolbar img {padding:2px;margin:0px}
</style>

以下是截图：

如果您查看来源，则此代码不可见。它来自哪里？

Answer 1

这可能是Chrome扩展程序。

要确认，请停用chrome：//扩展程序中的所有Chrome扩展程序（您必须复制/粘贴或将其键入网址栏）。

Answer 2

这是Chrome扩展程序中的叠加按钮的样式表信息＆＃34;网页屏幕截图＆＃34;。

如果你禁用它，你会发现它消失了。它是工具栏弹出样式信息，用于选择一个区域，您可以通过浏览器渲染的叠加层直接在页面顶部剪切，绘图和保存。

Answer 3

最可能的罪魁祸首是您已安装的扩展程序。

允许扩展（具有正确的权限）修改您访问的每个页面并对DOM进行任意更改，包括注入CSS。

使用隐身模式和/或停用扩展程序来验证这一点。