使 div 中的图像（不是背景 img）重复？

Question

我正在尝试重复一个 div 中没有背景图像的图像，但还没有想出如何。你能给我指出一个解决方案吗？

我的代码如下所示：

 <div id="rightflower">
<img src="/image/layout/lotus-dreapta.png" style="repeat-y; width: 200px;"/>
</div>

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

Answer 1

您使用 repeat-y 作为 style="background-repeat:repeat-y;width: 200px;" 而不是 style="repeat-y" 。

在图像标签内试试这个，或者你可以使用下面的 css 作为 div

 .div_backgrndimg
{
    background-repeat: repeat-y;
    background-image: url("/image/layout/lotus-dreapta.png");
    width:200px;
}

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

Answer 2

不是 CSS 你不能。你需要使用JS。将 img 复制到后台的快速示例：

 var $el = document.getElementById( 'rightflower' )
  , $img = $el.getElementsByTagName( 'img' )[0]
  , src  = $img.src

$el.innerHTML = "";
$el.style.background = "url( " + src + " ) repeat-y;"

或者您实际上可以重复图像，但重复多少次？

 var $el = document.getElementById( 'rightflower' )
  , str = ""
  , imgHTML = $el.innerHTML
  , i, i2;
for( i=0,i2=10; i<i2; i++ ){
    str += imgHTML;
}
$el.innerHTML = str;

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