html5移动端div的高度怎么设置自适应

在文档流中，DIV的高度默认就是根据内容的高度自适应的。

如果是想适配不同设备的窗口大小，可以设置百分比。或者通过position定位，然后设置top和bottom值。再或者利用css3的flexbox布局，设置父级的display为flex，方向为纵的，然后设置其flex：1；

这个方法就大致分为两种吧，

第一种，用CSS的方法

第二种，用JS方法

这里暂时只演示第一种，如果第二种，另外@我

示例代码如下：

CSS代码第一种写法

html,body{height:100%margin:0}/**把HTML和BODY的高度设置成100%**/

div{height:100%background-color:#ccc}/**把你DIV的高度设置成100%**/

CSS代码第二种写法

div{height:100%position:absolutewidth:100%background-color:#cccleft:0top:0}

这里用到position:absolute 所以HTML和BODY不需要设置100%

---