关于前端:app-内嵌H5-底部头部兼容

5次阅读

共计 571 个字符,预计需要花费 2 分钟才能阅读完成。

<meta name=”viewport” content=”width=device-width, initial-scale=1.0, viewport-fit=cover”>

viewport 能够设置的选项就是 viewport-fit, 它有三个可选值:
contain: The viewport should fully contain the web content. 可视窗口齐全蕴含网页内容
cover: The web content should fully cover the viewport. 网页内容齐全笼罩可视窗口
auto: The default value, 同 contain 的作用

通过给页面设置 viewport-fit=cover,能够将页面的布局区域延长到页面顶部和底部。

webview 内嵌 h5 底部还没有到底得加以下代码

body {padding-top: env(safe-area-inset-top); // 为导航栏 + 状态栏总高度(88px)padding-left: env(safe-area-inset-left); // 如果未竖屏时,为 0
padding-right: env(safe-area-inset-right); // 如果未竖屏时,为 0
padding-bottom: env(safe-area-inset-bottom); // 为底部圆弧高度(34px)}
正文完
 0