如何仅通过css更改Img标签src？

-3

如何通过css替换图片标签的src值？并且我想在ie8，firefox，chorme，safari中支持如何仅通过css更改Img标签src？

<div class="any"> 
<img src="images/i.png"/> 
</div>

只通过css替换这个src值。

感谢

来源

2013-07-31 Ankit Aggarwal

你不能。这不是CSS。 –

是啊.....什么？ – bozdoz

你可以通过javascript做到这一点 – Sunny

尝试设置背景图片，然后（与填充）移动开箱原始图像

这样的事情...

编辑我不得不调整它有点要把它的工作...

.any img { 
    display: block; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
    background: url(http://placehold.it/150) no-repeat; 
    width: 150px; 
    height: 150px; 
    padding-left: 150px; 
}

...这里是工作示例 http://jsfiddle.net/nNaRn/1/

来源

2013-07-31 07:43:32

你能解释一下盒子的尺寸属性吗？ –

“盒子尺寸”是指使用的盒子型号。 'border-box'告诉浏览器'width'和'height'的大小包括'padding'和'border'。没有它，它默认为'content-box'，它告诉浏览器将'width'视为内容的宽度，并且会添加'padding'和'border'的大小以获得最终的框宽。 –

请参阅http://www.paulirish.com/2012/box-sizing-border-box-ftw/针对'content-box'的情况。 –

您不能更改与CSS图像的src标签，因为图片src是无关的CSS。

你能做的就是设置div的背景图像，并获得完全摆脱img标签最接近的：除了这个

.any { 
    background-image: url('images/myimage.png'); 
}

，您将需要使用JavaScript。

来源

2013-07-31 07:40:38

您不能通过CSS更改src。虽然你可以做的是定义一个空白div，并通过CSS给它一个宽度，高度和背景图像。这种方法唯一的缺点是该元素不会像用户的图像（拖放，点击保存等）。

div.any { 
    width: 200px; 
    height: 200px; 
    background-image: url('./some-url-that-you-can-override-by-another-stylesheet'); 
}

来源

2013-07-31 07:41:24 Andreas

，你可以做的唯一的事情就是设置background-image到.any和display:none到img但你还需要设置width和股利height，因为没有内容的div有100％的宽度和高度为0。

.any { 
    width: 300px; 
    height: 300px; 
    background-image: url(image/1.gif); 
} 
.any img { 
    display: none; 
}

来源

2013-07-31 07:43:44 jcubic

如何仅通过css更改Img标签src？

回答

相关问题