解决刘海未全屏的问题 :
1.在 viewport 中添加 viewport-fit=cover
<meta name="viewport" content="width=device-width,initial-scale=1.0,viewport-fit=cover">
此时本地不会报警告,上线后打开控制台会报
The key "viewport-fit" is not recognized and ignored.
解决方法 :
清空 meta 标签中的空格
2.添加配套 css 兼容
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
html,body{height: 812px;
}