我在工作中遇到小程序的布局问题
此篇完全就是笔记和总结。
1
这种布局这样写。
.input{
flex:1
}
2
遇到这样的布局(flex布局但是最后一行的个数要少点的情况)
一般你一行有几个就写几个空的view.(例如我这行有三个我就写三个空的view)
wxss如下
不是空的view
month-item {
width:30%;
height:76rpx;
justify-content:space-around;
align-items:center;
background-color:#fff;
border-radius:10rpx;
margin-top:20rpx;
}
空的view
monthempty-item {
width:30%;
height:0rpx;
}
3
这种图片做背景的布局
wxml
<view class='bg'>
<image src='../../img/login-bg.png' ></image>
</view>
wxss
.bg {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
}
.bg image {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
先这么多,后续会更新。