css – 通过Chrome中注入的样式表进行奇怪的样式设计

前端之家收集整理的这篇文章主要介绍了css – 通过Chrome中注入的样式表进行奇怪的样式设计前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我们刚刚购买了Primeface Theme& Layout Sentinel.但是我注意到Chrome中的桌子上有一种奇怪的样式.表格页眉和页脚有橙色边框.我的同事们没有看到这一点,如果我改变我的镀铬配置文件,我也看不到它.

原文可以在这里看到:http://www.primefaces.org/sentinel/documentation.xhtml#j_idt38

我注意到Chrome正在注入一个样式表:

].ui-widget-header {
border: 1px solid rgb(231,143,8);
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
background: url(http://primefaces.org/sentinel/images/ui-bg_gloss-wave_35_f6a828_500x100.png) 50% 50% repeat-x rgb(246,168,40);
color: rgb(255,255,255);
font-weight: bold;}

这个注入的样式表来自哪里?我怎么能阻止它?我知道chrome扩展可以注入样式表但这个样式表有一个url到primefaces,或者只是一个红色的鲱鱼和扩展只是修改了现有的有效样式表?

更新:

.ui-widget-header {
/* border: 1px solid #3f7506; */
/* background: #3a8104 url("images/ui-bg_highlight-soft_33_3a8104_1x100.png") 50% 50% repeat-x; */
color: #ffffff;
font-weight: bold;

}

这是正常的样式表(它被其他一些样式覆盖,这就是为什么某些部分被注释掉了).此样式表存在于两个配置文件中.从URL可以看出,样式通常使用相对URI,但注入的样式使用绝对URI.

解决方法

好吧,我找到了罪魁祸首!我已经逐个禁用了每个扩展程序,直到页面显示正确.这是’CSS Selector Tester’.我认为这是我经常使用的一个很棒的工具,但是当我不使用它时它不应该与我的页面混在一起!

有趣的是,CSS Selector Tester在我看到样式问题的页面上不起作用.在其他页面上它工作正常.

猜你在找的CSS相关文章