FF和IE不从CSS加载img src

Question

我正在为像这样的css的图像设置src

#Banner {
content: url(../Banners/prussia-awesomeness.gif);
width: 1000px;
}

这是我的形象

   <div id="Header" class="Header">
        <img id="Banner" src="as"/>
    </div>

使用正确的img src加载谷歌浏览器中的图像(../Banners/prussia-awesomeness.gif)

在Internet Explorer和Firefox中,它将src保持为"as".

ie和ff不支持从css加载图像源吗？

编辑:

加入

#Banner:after {
content: url(../Banners/prussia-awesomeness.gif);
width: 1000px;
}

使它在Firefox中工作,但仍然拒绝合作.

还尝试添加:before(with:和::),这在任何浏览器中都没有区别

Answer 1

CSS 内容属性似乎不适用于 IMG，但适用于 IE 和 Safari 的其他元素。看看这个小提琴。对于 Safari，请查看此内容。

HTML：

<div id="Header" class="Header">
        <img id="Banner1" src="as"/>
    <h1 id="Banner">test</h1>
    </div>

CSS：

#Banner:before {
content: url(http://w3c.org/2008/site/images/favicon.ico);
width: 1000px;
}
#Banner1:before {
content: url(http://w3c.org/2008/site/images/favicon.ico);
width: 1000px;
}

如果您没有 DOCTYPE，它可能无法在 IE8 上运行！指定的。

对于 FF，您需要使用 :before 或 :after 伪元素才能使其工作。欲了解更多信息，请浏览此。