1. 程式人生 > >第4個小程式之旅的第一個問題:小程式頁面設定頁面高度100%

第4個小程式之旅的第一個問題:小程式頁面設定頁面高度100%

放程式碼:

<view class='login-container'>
  <view class='form-container'>
  </view>
</view>

wxss

.login-container{
  position: fixed;
  height: 100%;
  width: 100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content: center;
}
.form-container{
  position: absolute;
  bottom: 30rpx;
  height: 70%;
  width: 90%;
  border-radius: 25rpx;
  background: red;  
}

關鍵程式碼是父元素設定position: fixed;height: 100%;width: 100%; 注意了裡面的子元素不要再使用fixed,使用absolute基於父元素定位 在這裡插入圖片描述