微信小程序 - 横向靠右显示
·
需求:
![]()
标题在左边,点击图标在右边
代码:
wxml代码
<view class='flex-wrp-row item'>
<view class='item-left flex-wrp-row'>
<image src='../../image/ic_xxx.png' class='icon-left' mode='aspectFit'></image>
<text class='text'>左边</text>
</view>
<view class='item-right flex-wrp-row'>
<text class='text'>右边</text>
<image src='../../image/ic_right.png' class='icon-right' mode='aspectFit'></image>
</view>
</view>
wxss代码:
/* 水平显示 */
.flex-wrp-row {
display: flex;
flex-direction: row;
}
.item {
padding: 20rpx;
position: relative;
}
.item-left {
flex: 1; /* 重要 */
align-items:center;
}
.item-right {
position: relative;
align-items:center;
}
ฅ՞•ﻌ•՞ฅ ~ 厚着脸皮要个赞赏哈 ~ ฅ՞•ﻌ•՞ฅ

更多推荐

所有评论(0)