m0_70176506 2022-05-17 00:36 采纳率: 50%
浏览 27
已结题

小程序view 图片问题

img


蓝色图片无法写在文字前面
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;}

  • 写回答

1条回答 默认 最新

  • xcLeigh 全栈领域优质创作者 2022-05-17 17:59
    关注

    以下案例给你参考
    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
    }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 6月1日
  • 已采纳回答 5月24日
  • 创建了问题 5月17日

悬赏问题

  • ¥15 c#:vsto,powerpoint的外接程序中换主题颜色
  • ¥15 状态机/汽车转向灯/Sateflow
  • ¥15 这个有点复杂 有没有人看看
  • ¥15 用python如何确定子孙元素在父元素中的位置
  • ¥15 obj文件滤除异常高程
  • ¥15 用mathematicas或者matlab计算三重积分
  • ¥15 Loop unrolling的runtime计算
  • ¥100 NVMe-oF的Target端,开启attr_offload后,测试失败。
  • ¥100 有偿照片马赛克去掉,保留原始数据
  • ¥15 c# winform http报错,如何解决?