这个网站有问题:在所有浏览器中都可以,除了 safari。如您所见,在 safari 中,法拉利附近有 2 条不同红色的线,这是因为 safari 不读取我用来保持汽车图像相同红色的背景图像 1x1px(我'我使用图像,因为汽车已包含颜色配置文件,所以颜色代码不同)。
http://www.aformulaonehistory.com
谁知道为什么?
结构是这样的
<div class="background_color">
<div id="car_in_background">
</div>
</div>
像这样的CSS:
.background_color {
background: url('http://www.mydomain.com/img/image.jpg') repeat;
}
#car_in_background {
background: url('http://www.mydomain.com/img/car.jpg') no-repeat center center;
background-size:contain;
height:101%;
overflow:hidden;
position:relative;
}
谢谢!
编辑:我认为 safari 会读取背景图像,但不会读取颜色配置文件。这很奇怪,因为该图像合并了 ICC 配置文件(如 ffox 和 chrome 中正确显示的那样)。
最佳答案
嗯...如果我比较不同浏览器中的颜色代码,它们并不匹配。在 Safari 中加载的图片本身与在网站上或背景中的颜色完全不同。
但我想真正的问题是,在我的浏览器版本中根本没有加载 safari 上的背景图像,因此 Safari 使用颜色回退。
如果您在自己的网站上查看得非常详细,您会发现灰色图片也不是 100% 适合背景。
你可以试试这个: 使用
background: #c54040;
background: url('http://www.aformulaonehistory.com/img/backgr/c54040.jpg') repeat;
代替
background: #c54040 url('http://www.aformulaonehistory.com/img/backgr/c54040.jpg') repeat;
也许这有帮助 ;)
关于css - safari 背景图片不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18969828/