.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
c***@qq.com
- 发布：2021-12-31 00:27
- 更新：2022-04-14 16:17
- 阅读：1403
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 11.16
HBuilderX类型： 正式
HBuilderX版本号： 3.3.5
手机系统： Android
手机系统版本号： Android 12
手机厂商： 华为
手机机型： p30 pro
页面类型： vue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
操作步骤：
预期结果：
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}实际结果：
.modal{position:fixed;inset:0;}
.modal{position:fixed;inset:0;}bug描述：
scss写的样式
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}编译打包之后成
.modal{position:fixed;inset:0;}如果css写成
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: constant(safe-area-inset-bottom);
bottom: env(safe-area-inset-bottom);
}就不会变
2 个回复
1***@qq.com
解决了吗
s***@qq.com
如下代码可解决：