Isa*_*bow 9 css google-chrome background-image google-chrome-devtools
我正在使用jQuery的.css()方法来设置a的背景图像div.因此,处于最终状态的HTML是:
<div id="front-page-bg" style="background-image: url(http://peterfcarlson.com/wp-content/uploads/2011/09/ert-011.jpg); display: block; "></div>
它工作正常,但是,我在Chrome中收到错误/警告,其中background-image属性被击中,好像它因输入错误而被忽略,即使它显然被应用了.为什么会这样?这是Chrome的问题,还是我的问题?

我已经在FF和IE中测试了这个页面,它似乎也没有任何错误或类似的警告.关于为什么会发生这种情况的想法,也许更重要的是,我应该忽略它,因为该页面似乎正在发挥作用?
编辑:
通过更深入地检查(忽略第一个误导性的404图像问题),似乎开发人员工具忽略了样式定义; 事实上它应用了一个
not-parsed-ok附加警告图标的overloaded类,以及一个导致直通的类.如果使用background代替background-imagecss定义,则不会附加重载的类.
但要发现这种行为的原因,有必要分析开发人员工具源代码.
我猜这是一个开发人员工具bug /不完整的功能.
这是我自己的测试:

你可以看到使用的图像是本地的,并有apix.这是由此产生的检查:

使用不存在的css属性进行测试时,它显示相同的行为:

您引用的图像有一些奇怪的Web服务器问题:实际上它返回404错误(可能是超时?),然后是重定向.
因此,您应该检查图像和Web服务器路径,而不是实际的html代码.

即使尝试输入实际的html代码,错误也是一样的:

这是您的Web服务器的实际响应,而不是您的图像:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html,body{height:100%;width:100%;margin:0;padding:0;}
body{overflow:hidden;background:#EDEDED url(http://peterfcarlson.com/wp-content/themes/comingsoon/pfc.png) center center no-repeat}
</style>
</head>
<body>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
问题是 DevTools/WebInspector 错误。DevTools UI 代码仅显示 DevTools 后端部分并不总是正确生成的数据。
WebKit 错误:https://bugs.webkit.org/show_bug.cgi? id=70325
铬错误:http://code.google.com/p/chromium/issues/detail? id=100646
| 归档时间: |
|
| 查看次数: |
4224 次 |
| 最近记录: |