小程序页面高度控制

Posted 2020-10-02 MR_CHW

page {
  background-color: #fbf9fe;
  height: 100%;
}

/*这个100%屏幕高度*/

.container {
  font-family: ‘Trebuchet MS‘,
                 ‘Lucida Sans Unicode‘,
                 ‘Lucida Grande‘,
                 ‘Lucida Sans‘,
                 Arial,
                 sans-serif,
                 sans-serif;
  font-size: 32rpx;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 20rpx 0rpx;
  box-sizing: border-box;
  overflow: hidden;
  background-color: #fbf9fe;
  position: relative;
}

　　

/*这个auto高度*/

.containerLine {
  font-family: ‘Trebuchet MS‘,
                 ‘Lucida Sans Unicode‘,
                 ‘Lucida Grande‘,
                 ‘Lucida Sans‘,
                 Arial,
                 sans-serif,
                 sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  font-size: 32rpx;
  height: auto;
  background-color: transparent;
  text-align: center;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  position: relative;
}