如何使用CSS更改图像源？

Question

我想用CSS

更改显示的图像

<a href="/"><img id="image1" src="http://somepic.jpg"></a>

因为我认为src没有css，我必须让它透明并以某种方式在后台显示另一张图片？

Answer 1

你做不到。你可以用Javascript改变它。

使用CSS，您可以将图片设置为display:none;在父元素上设置background-image。

Answer 2

我会建议以下替代方案：

• （特别是）如果<img>没有语义值，请完全删除它们，以便将background-image放在其他元素上。
• 如果新图像为文档提供了语义值，并且您可以预先加载它们，请将它们作为附加<img>插入，然后用css隐藏其中一个（假设这是为了一个hover或其他类似的条件效应）
• 使用javaScript
更改src

Answer 3

尽管CSS仅用于演示，但CAS（级联属性表）已经被提出并且在思考中，但我认为在下面代码的基本用途应该适用于你，

<style>
a:after
{
content:url(your_image.jpg);
}
#image1
{
display:none;
}
</style>