背景图像不显示在Chrome浏览器中

时间:2013-03-21 14:40:24

标签: html css html5 google-chrome

我创建了一个小型搜索小部件,但是通过chrome查看时不会显示背景。我已经测试了IE,FF和safari,它们都显得很好。

http://paradigmsearch.co.uk/widget/?id=1

我通常不愿意在SO上放置布局问题。但是,我已经讨论了一段时间了。

关于元素:

<div class="widget" id="id_300x250">

我正在应用以下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;
}

背景不明显。如果这是一个非常愚蠢的标记/ css疏忽,那么我很抱歉。

目前使用Chrome浏览器版本25.0.1364.172m

2 个答案:

答案 0 :(得分:15)

这是一个非常有趣的问题,我在Chrome的隐身模式下打开您的页面时才发现:AdBlock阻止了您的背景图片。

此外,出于渲染目的,最好将style元素粘贴到页面的head中。

答案 1 :(得分:0)

我使用chrome 25.0.1364.172m测试了您的代码,所有内容都显示正常。

检查一下:http://jsfiddle.net/rcHMc/

HTML

<div class="widget" id="id_300x250">

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;
}