javascript 实现图片自动适应DIV的大小并进行拉伸,使图片不重复显示

JavaScript013

javascript 实现图片自动适应DIV的大小并进行拉伸,使图片不重复显示,第1张

楼主，这个我接触多了你试试我的.可以的话求采纳。

css:

.div1{width:100px}//这个随意设置

.div1 img{width:100%}

html:

<div class="div1"><img src="我的图片" /></div>

将这个图切成三份

抱歉，你的图我这没法用，自己弄个了，随便做个示意就好

这三个图，中间的那个给背景图然后平铺就可以了，代码我就不给你写了，思路给了就好了吧

你的div的结构是下面这种结构吗？

<div>

     <img>

</div>

如果是的话，你先获取到div，

然后在div里获取img；

var aImg=document.getElementById("div's Id").getElementsByTagName('img')

for(var i=0i<aImg.lengthi++){

      aImg[i].style.height="the height you want"

      aImg[i].style.width="the width you want"

}

如果你所说的图片是指div的background，那么你可以在CSS里面用：

background-size:50px 100px（调整背景图片的大小）

background-repeat:no-repeat（是否平铺，否）

/*也可以：*/

background-size:40%100%（对背景图片进行拉伸）

当然用js的话也可以：

img.style.backgroudSize='50px 100px'

img.style.backgroudRepeat='on-repeat'