【IE BUG系列】背景图像不显示错误

作者:维尼Bernie 发于
二 2, 2012

CSS

原文:
http://haslayout.net/css/No-Background-Image-Bug

翻译 by 维尼Bernie

受影响的IE版本

IE8, IE7, IE6

症状:

当设置了背景图像在IE下不显示 (使用 background 缩写形式).

描述:

这个bug基本上都是”懒人”才会遇到的. 之所以这么说,是因为引起这个问题的原因仅仅是因为在设置background属性时漏掉空格. 有很多种漏敲空格的组合会导致这个bug, 这里我会给出一个示例: 在url()和随后的属性(比如no-repeat)之间漏写空格.

HTML Code:

<div></div>

CSS Code:

div {
    width: 500px;
    height: 115px;
    background: #fff url(/pics/hl_logo.png)no-repeat;
    /* 注意这里在url()后面没有空格 */
}

在其他浏览器中这个瓢虫的背景图像可以显示, 但是IE下就显示不出来.

解决方法描述:

这个可能是最容易修改的几个IE bug之一了,只要简单的在url()后面加上空格就OK了.

以下是示例:

HTML Code:

<div></div>

CSS Code:

div {
    width: 500px;
    height: 115px;
    background: #fff url(/pics/hl_logo.png) no-repeat;
    /* 注意这里在url()后面添加了空格 */
}

好了,现在IE的世界清净了(bug不再了)!

备注

如果你有更好的方式欢迎留言添加,如果你发现本文翻译错误请发邮件给我们 trans4un[at]gmail.com ,你将成为我们的纠错贡献者

Tags:
bug
,
hasLayout系列

稿源:前端翻译小站 (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 营销策划 » 【IE BUG系列】背景图像不显示错误

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录