图像不会在 Internet Explorer 中加载“内容：url()”答案

【问题标题】：Image won't load with "content: url()" in Internet Explorer图像不会在 Internet Explorer 中加载“内容：url()”
【发布时间】：2014-05-18 18:11:49
【问题描述】：

我正在开发一个网站，我的网站必须在 Chrome 和 Internet Explorer 9 中运行。我快完成了，只剩下一个问题。如果我想加载带有“内容：url（）”的图像，它在 Chrome 中可以完美运行，但在 IE9 中却不行。有人可以给我另一个解决方案，我不必更改我的 HTML。

我的 HTML：

<!DOCTYPE html>
 <html lang="nl">
 <head>
  <title>Test</title>
  <meta charset="utf-8" />
  <link rel="stylesheet" href="test.css" />
 </head>
 <body>
  <header>
  </header>

  <a id="photo">Photo</a>

  <footer>
  </footer>
 </body>
</html>

我的 CSS：

#photo {
 content: url('right-button.png');
}

【问题讨论】：

这是未定义的行为。你肯定需要一个替代解决方案 - 这不应该被依赖。（在你问之前，不，我没有给你任何解决方案。我只是为了后代而做这个笔记。）

标签： html css internet-explorer

【解决方案1】：

试试这个：

#photo {
    background: url("right-button.png") no-repeat;

}

有关更多信息，请阅读我为content 属性找到的一些文章：

content property,W3c

【讨论】：