小程序view 图片问题

Question

蓝色图片无法写在文字前面
wxml
<view class="container">

<view class="box">
<text class="title">我要缴费</text>
<text class="copy">可按照缴费单上的识别码查询或者按照学生编号查询缴学费或其他费用</text>
</view>

</view>

wxss
.container {
display: flex;
flex-direction: row;
height: 290rpx;
background: rgb(255, 255, 255); margin: 40rpx; border-radius: 8rpx;
}

.box {
width: 480rpx;
margin-left: 80rpx;
display: flex;
flex-direction: column; justify-content: center; font-size: 34rpx;
}
.title{
font-size: 34rpx;
word-break:break-all;
line-height: 60rpx;
letter-spacing:5rpx;
}
.copy {
font-size: 30rpx;
word-break:break-all;
color: #858585;
letter-spacing:4rpx;
}
.container image{ width: 50rpx;height: 50rpx;}

Answer 1

以下案例给你参考
wxml

<view class="view_tupian_wenzi">
      <image class="image_1" src="../images/main_yewu.png" />
      <view class="view_wenzi2">
        <text>服务项目</text>
        <text class="text_small">进入服务项目，查看项目数据</text>
      </view>
    </view>

wxss

.view_tupian_wenzi {
  display: flex;
  flex-direction: row;
  margin-left: 10px
}
.image_1 {
  width: 50px;
  height: 50px;
}
.view_wenzi2 {
  width: 90px;
  margin-left: 5px;
  display: flex;
  flex-direction: column;
}
.text_small{
   font-size: 27rpx;
   word-break:break-all;
   color: #7a7878
}