自动动态改变div的高度_IT百科

function onLoad(){

var workSpaceW = document.getElementById("body").parentElement.offsetWidth//宽度

var workSpaceH = document.getElementById("body").parentElement.offsetHeight//高度

document.getElementById("flowDiv").style.height = workSpaceH-75

}

</script>

<div id="flowDiv"

style="width: 150pxOVERFLOW-X: autoOVERFLOW: scroll">

dddd

</div>

<dody>

1、首先创建或者打开我们的web项目，新建一个html文件和css文件即可，如图所示。

2、html页面代码如图所示，定义一个div，然后给一个id属性即可。

3、这里是使用宽度的百分比之后，设置高度值为零，然后使用padding属性的top或者bottom的值（可以是任意百分比），背景颜色作为测试。

4、然后在浏览器运行之后的效果是这样的哦，放大缩小浏览器，宽高会随之改变。

5、这个方法是使用expression来设置高度即可。

1、首先在编辑器建立了一个静态页面，在body中添加两个div，设置宽度，并设class 为div1和div2，在两个div的class 中添加相同的控制图片的class名为了 ”img“，并为div添加控制宽度的样式：

2、在两个div中加入相同的图片，这个时候需要在img 类中加入css语句设置一下div的高度和宽度，以及div的边框，然后就可以设置img的样式了：

3、最后设置img的样式中图片的高度为auto，宽度为100%，这样就可以自适应浏览器了，来到浏览器，可以看到设置了自适应的图片自动填满整个div了，而没有设置的则是填充了一部分。以上就是让div自动适应自身的img高度：

欢迎分享，转载请注明来源：内存溢出

自动动态改变div的高度