<view class="section-container">
  <scroll-view scroll-x enable-flex="true" class="scroll-box">
    <block wx:for="{{aniDetails.crt}}" >
      <view class="crt-list">
        <view class="crt-icon-box">
          <image class="crt-icon" src="{{item.images.grid}}"></image>
          <text class="crt-role">{{item.role_name}}</text>
        </view>
        <view class="crt-name-box">
          <text class="crt-name text-el">{{item.name_cn?item.name_cn:item.name}}</text>
          <view class="crt-cvname-list text-el">
            <block wx:for="{{item.actors}}">
              <text class="crt-cvname">CV:{{item.name}}\n</text>
            </block>
          </view>
        </view>
      </view>
    </block>
  </scroll-view>
</view>
.section-container {
  margin: 30rpx 40rpx;
}
.scroll-box {
  white-space: nowrap;
  display: flex;
}
.crt-list {
  display: inline-block;
  margin-right: 15rpx;
}
.crt-icon-box {
  position: relative;
  width: 150rpx;
  height: 150rpx;
}
.crt-icon {
  width: 100%;
  height: 100%;
}
.crt-role {
  position: absolute;
  top: 0;
  left: 0;
  background: #3bc0c3;
  color: #fff;
  width: 50rpx;
  height: 30rpx;
  border-radius: 30rpx;
  line-height: 30rpx;
  text-align: center;
  font-size: 22rpx;
}
.crt-name-box {
  margin-top: 10rpx;
  width: 150rpx;
}
.crt-name {
  display: block;
  font-size: 26rpx;
  color: #666;
  text-align: center;
  margin-bottom: 5rpx;
}
.crt-cvname-list {
  font-size: 22rpx;
  color: #999;
}

在开发工具端打开会这样，在手机预览正常显示