Question

是否有可能以某种方式使用带有背景图像的新图像覆盖图像？

我不能根据css的视网膜改变图像。

实施例

HTML：

<img id="foo" src="foo.png">

CSS：

#foo { background: url("bar.png") }

Answer 1

对我来说似乎有点令人费解的策略。让我建议一个处理视网膜质量图像的更好选择。我见过的最简单的策略（在这个阶段我感觉最好）是在Photoshop中将图像的宽度和高度设置为两倍，然后将其保存在相当低的质量下以保持文件大小不变。在HTML或CSS或两者中，设置图像的所需宽度和高度。通过这种方式，它在普通和视网膜屏幕上看起来都很棒，并且文件大小仍然很小。你只需要一张图片，这很棒。

Answer 2

尝试使用css3 :before：

img{
  display:none;
}
img:before{
  content: "";
  width: 20px;
  height: 20px;
  background: url("bar.png");
}

CSS - 可以用背景图像覆盖图像吗？

2 个答案: