热搜:NVER node 开发 php

移动设备页面高度不足时min-height 的尴尬处理_html/css_WEB-ITnose

2024-11-13 14:55:02
移动设备页面高度不足时min-height 的尴尬处理_html/css_WEB-ITnose

在做html5的页面时,经常遇到页面内容太少撑不起来整个手机屏幕的高度。

我们经常使用min-height来处理,比如min-height:568px; 对应的是iPhone5 的高度;

而这样iPhone6plus下方就会出现空白。

而如果设置 min-height:736px; iPhone5的话就会出现滚动条;

此时我们可以使用

position:absolute;left:0;right:0;top:0;bottom:0;

把min-height 干掉 就适应任何屏幕100%高度啦。