html - 为什么 CSS 内容图片不显示？

Question

考虑这个 html:

<div class="logo-b"></div>

还有这个 CSS:

div.logo-b {
    content: url(http://placehold.it/350x150);
    height: 150px;
    border: 1px solid darkred;
}

我正在尝试使用 CSS 显示图像。图像未显示。请看这个jsfiddle明白我的意思。请问我错过了什么？

编辑:看来 Chrome 呈现了我在上面提供的 fiddle ，但 Firefox(我使用的)没有。如果我添加 :before或 :after我的 CSS 中的类名图像显示在 Firefox 中。有人能解释一下为什么会这样吗？

编辑:我使用错误的构造将图像放置在我的页面上。在我正在做的事情的上下文中，我应该使用 <img>标签。 CSS content构建使用:before和/或 after放置内容，包括图像，但我知道这些是在特定上下文中使用的。我只是想显示一个 Logo 。

Answer 1

This property content is used with the :before and :after pseudo-elements to generate content in a document. -W3C

我认为 Firefox 中的行为是正确的。