问题
webAPP中内嵌的H5页面设置margin-bottom,在模拟器及安卓机中的展示效果都与预想的一样。而在iPhone中无论嵌套多少层margin-bottom,均会失效。
原因
从IOS8开始,UIView的属性var layoutMargins:UIEdgeInsets指定该View的subview同其edge的间距。AutoLayout使用margins来放置内容。其默认值为8pt。
如果一个View是ViewController的rootview,系统会自动设置和管理margins,top和bottom。margins为0pt。所以自己设定的margin-bottom会失效。
解决方案
针对IOS端margin-bottom失效问题目前有两种解决方案:
div撑开
用设定了高度的div撑开底部,达到与margin撑开的相同的效果。
改用padding-bottom
使用padding-bottom撑开底部,大多数情况下可以满足安卓端和IOS端的展示需求。
本人才疏学浅,以上仅为个人见解,欢迎批评指正讨论~~
转载链接:https://juejin.im/post/5c1c4ed6f265da6110370532