微信小程序中让元素占据整个屏幕高度的实现方法
更新时间：2016年12月14日10:19:03投稿时间：lqh
本文主要介绍微信小程序中让元素占据整个屏幕高度的实现方法的相关资料。有需要的朋友可以参考以下
微信小程序中让元素占据整个屏幕高度的实现方法
在项目中，经常会使用一个容器元素来填充屏幕的高度和宽度，然后在这个容器元素中放置其他元素。
宽度就是width:100%
但是height呢微信小程序实现记事本，我们知道的是height: 100%必须在给定父元素高度的时候给。
我以前用js获取屏幕的高度，然后赋值给height，
网页中屏幕的高度为：window.innerHeight;
在微信小程序中，需要调用wx.getSystemInfo接口，然后通过setData赋值
但显然是通过js来完成的微信小程序实现记事本，直接给样式肯定不如css高效。
所以我们使用另一种方法：
在网页中设置body,html{height:100%};
将 body 和 html 设置为 100%，这样我们就可以在它们的子元素中使用 height:100% 来使我们的容器元素填充屏幕的高度。
但是在微信小程序中，是没有dom对象的，但是我们可以看到在dom树中（不知道怎么称呼，就这么称呼吧），根节点是page，所以我们可以看到当我们查看调试工具时尝试使用 page{height:100%}
果然，它有效。高度占据整个小程序的窗口。
这样我就可以愉快地继续编写我的小程序了。
感谢您的阅读，希望对您有所帮助，感谢您对本站的支持！
