<view class="avatarBox center"> <t-avatar bindtap="previewImage" data-url="{{detail.avatarUrl}}" wx:if="{{detail.avatarUrl}}" image="{{detail.avatarUrl}}" /> <t-avatar wx:else icon="user" /> <view class="genderBox boy" wx:if="{{detail.gender === '1'}}"> <t-icon name="gender-male" /> </view> <view class="genderBox girl" wx:if="{{detail.gender === '2'}}"> <t-icon name="gender-female" /> </view> </view>
.genderBox { position: absolute; right: 50rpx; bottom: 10rpx; border-radius: 50%; color: white; padding: 8rpx; box-sizing: border-box; } .center { text-align: center; } .avatarBox { position: relative; width: 300rpx; margin: 60rpx auto 30rpx auto; } .girl { background-color: pink; } .boy { background-color: #027CBE; }
