Html chrome浏览器中不显示背景图片
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15550560/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Background image not displaying in chrome browser
提问by Lee Davis
I've created a small search widget, however the background doesn't appear when viewing it through chrome. I've tested IE, FF and safari which all appear OK.
我创建了一个小的搜索小部件，但是通过 chrome 查看它时没有出现背景。我已经测试了 IE、FF 和 safari，它们都显示正常。
http://paradigmsearch.co.uk/widget/?id=1
http://paradigmsearch.co.uk/widget/?id=1
I'm usually reluctant to put layout issue on SO. However, I've been going over this for a while.
我通常不愿意把布局问题放在 SO 上。但是，我已经讨论了一段时间。
On the element:
在元素上：
<div class="widget" id="id_300x250">
I'm applying the following CSS definitions
我正在应用以下 CSS 定义
.widget {
font-family: arial;
height: 250px;
width: 300px;
border: none;
background: url('/uploads/widget_background/cached/proportional/300x250/1_512648b566578.png') no-repeat center center;
}
The background just isn't visible. If this is a really silly mark-up / css oversight then I apologies profusely.
背景只是不可见。如果这是一个非常愚蠢的标记/css 疏忽，那么我深表歉意。
Currently using chrome browser Version 25.0.1364.172m
目前使用 chrome 浏览器版本 25.0.1364.172m
回答by James Donnelly
This is a pretty funny issue which I only figured out when opening your page in Chrome's incognito mode: Your background image is being blocked by AdBlock.
这是一个非常有趣的问题，我只有在 Chrome 的隐身模式下打开您的页面时才发现：您的背景图片被 AdBlock 屏蔽了。
Also, for rendering purposes it's better practice to stick styleelements in your page's head.
此外，出于渲染目的，最好将style元素粘贴到页面的head.
回答by Cao Minh
I've tested your code using chrome 25.0.1364.172m, all appear OK.
Check it: http://jsfiddle.net/rcHMc/
我已经使用 chrome 25.0.1364.172m 测试了您的代码，一切正常。
检查它：http: //jsfiddle.net/rcHMc/
HTML
HTML
<div class="widget" id="id_300x250">
CSS
CSS
.widget {
font-family: arial;
height: 250px;
width: 300px;
border: none;
background: url('http://paradigmsearch.co.uk/uploads/widget_background/cached/proportional/300x250/1_512648b566578.png') no-repeat center center;
}
