最顶部放一个高度为“var(--status-bar-height)”的div
- <view>
- <view class="status_bar">
-
- view>
- <view> 状态栏下的文字 view>
- view>
-
- <style>
- .status_bar {
- height: var(--status-bar-height);/*刘海儿的高度*/
- width: 100%;
- background-color:#007AFF ;
- }
- style>
方案二、高度自适应
- <view>
- <view class="content"> 状态栏下的文字 view>
- view>
-
- <style>
- .content {
- height: calc(100vh + var(--status-bar-height));/*加上刘海儿的高度*/
- width: 100%;
- background-color:#007AFF ;
- }
- style>