示例如下
样式>>
.itemmodule {
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
padding-left: 11px;
padding-right: 11px;
margin-bottom: 5px;
.itemouter {
height: 66px;
width: 62px;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
.itempic {
height: 25px;
width: 25px;
margin-top: 5px;
}
.itemnote {
width: 62px;
line-height: 24px;
font-size: 13px;
text-align: center;
}
}
} ui使用-->
<view class="itemmodule">
<view class="itemouter">
<image class="itempic" src="/static/images/services/1.png" mode="aspectFit"></image>
<text class="itemnote">请假</text>
</view>
<view class="itemouter">
<image class="itempic" src="/static/images/services/2.png" mode="aspectFit"></image>
<text class="itemnote">销假</text>
</view>
<view class="itemouter">
<image class="itempic" src="/static/images/services/3.png" mode="aspectFit"></image>
<text class="itemnote">统计</text>
</view>
<view class="itemouter">
<image class="itempic" src="/static/images/services/4.png" mode="aspectFit"></image>
<text class="itemnote">下载</text>
</view>
<view class="itemouter">
<image class="itempic" src="/static/images/services/5.png" mode="aspectFit"></image>
<text class="itemnote">快照</text>
</view>
</view>
0 个回复