···.navi-zone {
position: fixed;
z-index: 888;
// top: var(--window-top) + var(--status-bar-height) ;
top: var(--status-bar-height) ;
left:0;
width:100%;
height: 44px;
overflow-x:hidden;
border-bottom: 1rpx solid #F1F1F1;
background-color: #FFFFFF;
box-shadow:1px 0px 2px #DDDDDD;
···
cecf
- 发布：2020-05-22 21:39
- 更新：2020-07-11 11:13
- 阅读：1913
产品分类： uniapp/小程序/微信
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win7
HBuilderX类型： 正式
HBuilderX版本号： 2.7.5
第三方开发者工具版本号： 没关系
基础库版本号： 没关系
项目创建方式： HBuilderX
示例代码：
操作步骤：
···.navi-zone {
position: fixed;
z-index: 888;
// top: var(--window-top) + var(--status-bar-height) ;
top: var(--status-bar-height) ;
left:0;
width:100%;
height: 44px;
overflow-x:hidden;
border-bottom: 1rpx solid #F1F1F1;
background-color: #FFFFFF;
box-shadow:1px 0px 2px #DDDDDD;
···
···.navi-zone {
position: fixed;
z-index: 888;
// top: var(--window-top) + var(--status-bar-height) ;
top: var(--status-bar-height) ;
left:0;
width:100%;
height: 44px;
overflow-x:hidden;
border-bottom: 1rpx solid #F1F1F1;
background-color: #FFFFFF;
box-shadow:1px 0px 2px #DDDDDD;
···
预期结果：
既然是变量，应该可以运算。
文档并没提到，这俩变量不可以运算。
既然是变量，应该可以运算。
文档并没提到，这俩变量不可以运算。
实际结果：
···===0···
···===0···
bug描述：
本来想偷懒，不用单独放一个占位view，用var(--window-top) + var(--status-bar-height) 直接定位正主儿，结果发现不成。
微信小程序模拟器里：top: var(--window-top) + var(--status-bar-height) ///结果top ==0。
进一步实验，发现 这个var(--status-bar-height) 不能在scss里运算，即：
top: var(--status-bar-height) + 20px ; ///结果top等于0。
1 个回复
renxing2436
计算属性需要用calc
如：top:calc(var(--status-bar-height) + 20px) ;