移动端h5页面设计图高度小于iPhone8等长屏手机解决方案

在做移动端页面的时候,我们经常会遇到一些psd高度小于iPhone8手机高度的问题,这样按照设计图做出来的页面在iphone8手机上底部会出现白色的空白区域

解决办法:html与body设为高度100%,同时给body设置一个背景色,但是这里有一个小坑,如果是这样设置的background-color:rgba(226, 68, 51),在电脑浏览器上预览时是没有问题的,但是在真机上依然会出现底部白色屏,原因是因为电脑浏览器会将rgba(226,68,51)解析为rgb(226,68,51) 但是手机端不会,所以要么用rgba(226,68,51,1) 要么直接写rgb(226,68,51)

猜你喜欢

转载自blog.csdn.net/qq_40028324/article/details/80552550