DIV CSS 如何让网页中的某DIV自动适应屏幕高度自己变如下图

html-css09

DIV CSS 如何让网页中的某DIV自动适应屏幕高度自己变如下图,第1张

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

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

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

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

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

网页里面的宽度是可以用百分比决定的,可以设置这个容器的宽度占屏幕宽度的百分之多少,但是因为百分比的宽度是要有参考对象的,所以在设置百分比的宽度时,要先设置body的宽度为100%。

照你的要求:一屏分为两栏显示,那么用两个DIV来做,一个DIV的宽度就是50%,两个在一起就正好100%了,如果你想这两个DIV之间有间距,那么就设置宽度为48%就行,具体自己把握,然后设置左边的DIV左浮动,右边的DIV右浮动即可。

高度是可以设置固定像素的,比如一个div的宽度为48%,高度为50px都行的,可以混用,只要记住使用百分比定义宽高长度就要设置对应的body的宽高为100%就行了