昨天被通知“软”裁员了，今天也没什么心情干活，毕竟自己不会愚蠢到“别人要杀你，你还帮对方磨刀”的地步。
之前做VC++和安卓JAVA的，没有做过CSS一类的页面布局，今天练手了一下微信小程序，发现一个奇怪的问题，在多层嵌套view下，并且width 和height都为100%时，用display:flex , align-items:center,都没法设置居中，最后通过设置父级View的
position:fixed;
justify-content: center;
并且还要固定子view内容的中间行高 height: 200rpx;，
才能实现垂直居中，
重点代码：
.flex_display {
display: flex;
display: -webkit-flex;
}
.column{
flex-direction:column;
}
.container_center{
width: 100%;
height: 100%;
margin: 0 auto;
align-items:center;
}
.container_center_cup{
width: 100%;
height: 200rpx;
}
.position_fixed{
position:fixed;
}
.ac {
align-items: center;
}
.jc{
justify-content: center;
}
<view class="flex_display column container_center jc position_fixed ">
<!-- 杯-->
<view class="flex_display row container_center_cup jc ">
<!-- 这里旋转的内容就会在整个页面垂直和水平居中-->
</view>
</view>
以上图片为垂直和水平居中效果, 如果还有问题,请给我留言 .还不知道怎么发源码附件，有需要的请留言。
#微信小程序# #万年历# #CSS#
