【小程序】微信小程序如何实现view上下分屏固定比例，且具有滚动条效果（已解决）

 

wxml代码

<view class="winUp">

<view>第1行</view>
<view>第2行</view>
<view>第3行</view>
<view>第4行</view>
<view>第5行</view>
<view>第6行</view>
<view>第7行</view>
<view>第8行</view>


</view>


<view class="winDown">
</view>

wxss代码

page {
  background-color: rgb(228, 227, 227);
}

.winUp {
  width: 100%;
  height: calc(100vh - 200px);
  background-color: rgb(248, 223, 228);
    overflow: hidden;
    overflow-x: hidden; /*x轴禁止滚动*/
    overflow-y: scroll; /*y轴滚动*/
  }
  .winUp::-webkit-scrollbar {
    display: none;/*隐藏滚动条*/
  }


.winUp view{
  height:80px;

}

.winDown {
  width: 100%;
  height: 200px;
  background-color: rgb(193, 214, 253);
}