css处理ios刘海屏问题


<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1.0,user-scalable=no,viewport-fit=cover" />
viewport-fit 设置为cover

.home{

    padding-bottom:constant(safe-area-inset-bottom); //兼容IOS < 11.2

    padding-bottom:env(safe-area-inset-bottom);//兼容IOS > 11.2

}

ps:constant必须写在前面,env写在后面。

constant与env有4个预设变量:

safe-area-inset-top //上方刘海

safe-area-inset-left

safe-area-inset-right

safe-area-inset-bottom //下方home键


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM