当前位置:首页 > IT技术 > 移动平台 > 正文

css处理ios刘海屏问题
2021-09-09 13:52:33

<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键

本文摘自 :https://www.cnblogs.com/

开通会员,享受整站包年服务立即开通 >