首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用Chrome扩展将CSS注入到文档检查器中

使用Chrome扩展将CSS注入到文档检查器中
EN

Stack Overflow用户
提问于 2011-07-25 09:01:53
回答 4查看 971关注 0票数 4

我目前正在尝试编写一个扩展来改变文档检查器("devtools.css")的CSS。我使用Content Scripts和Match Pattern将CSS注入到其他网页中没有任何问题,但它似乎不能针对Inspector。是我漏掉了什么,还是有更好的方法来解决这个问题?

结果:在检查了Match Pattern documentation之后,我注意到哪里出错了,模式部分对它所允许的URL类型是非常严格的,"chrome-devtools“不在其中。

更新:经过几个小时的工作,我已经开始使用实验性的API在Inspector中生成一个新的面板,但仍然没有成功地将css注入到它的父级中。

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2011-07-25 10:17:59

我不认为Webkit允许您将CSS或Javascript注入到开发工具中。Chrome有一个实验性的应用程序接口,它允许你添加标签和其他一些东西:http://code.google.com/chrome/extensions/trunk/experimental.devtools.html

票数 2
EN

Stack Overflow用户

发布于 2012-11-26 16:02:10

现在有一种方法可以做到这一点,但不是通过Chrome扩展。

您可以将样式放入在每个页面上运行的Custom.css中,外加一个选择器(#-webkit-web-inspector),该选择器对于检查器来说应该是唯一的。

http://darcyclarke.me/design/skin-your-chrome-inspector/

票数 2
EN

Stack Overflow用户

发布于 2011-07-25 10:08:26

您是否在清单中设置了"all_frames“,是否使用了正确的URL权限?开发人员工具URL代码块:

代码语言:javascript
代码运行次数:0
运行
复制
<a href="chrome-devtools://devtools/devTools.css"
class="webkit-html-resource-link"
title="chrome-devtools://devtools/devTools.css" style="max-width: 100%;
" line_number="1828" preferred_panel="resources">devTools.css:1828</a>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/6810873

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档