新手上路，请多包涵

是否可以在 CSS 中设置 src 属性值？

大多数情况下，我们是这样使用的：

 <img src="pathTo/myImage.jpg" />

我希望它是这样的

<img class="myClass" />

 .myClass {
    some-src-property: url("pathTo/myImage.jpg");
}

我想知道是否有一种方法可以不使用 background 或 background-image CSS 中的属性。

原文由 Rakesh Juyal 发布，翻译遵循 CC BY-SA 4.0 许可协议

阅读 456

2 个回答

得票最新

✓ 已被采纳

完整的工作解决方案（ 现场演示）：

 <!doctype html>

<style>
.MyClass123{
    content:url("http://imgur.com/SZ8Cm.jpg");
}
</style>

<img class="MyClass123"/>

测试和工作：

测试和不工作：

原文由 Pacerier 发布，翻译遵循 CC BY-SA 4.0 许可协议

我今天找到了一个解决方案（适用于 IE6+、FF、Opera、Chrome）：

 <img src='willbehidden.png'
 style="width:0px; height:0px; padding: 8px; background: url(newimage.png);">

这个怎么运作：

图像缩小，直到宽度和高度不再可见。
然后，您需要使用填充“重置”图像大小。这个给出了一个 16x16 的图像。当然你可以使用 padding-left / padding-top 来制作矩形图像。
最后，使用背景将新图像放在那里。
如果新背景图像太大或太小，我建议使用 background-size 例如： background-size:cover; 适合您的图像到分配的空间。

它也适用于提交输入图像，它们保持可点击。

查看现场演示： http ://www.audenaerde.org/csstricks.html#imagereplacecss

享受！

原文由 Rob Audenaerde 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答

推荐问题

子站问答

本篇内容翻译自 Stack Overflow，如果你觉得翻译结果值得改进，欢迎直接编辑修改，感谢你为社区贡献。

相似问题

找不到问题？创建新问题

是否可以在 CSS 中设置等同于 img 标签的 src 属性？