HarmonyOS鸿蒙Next中Span组件确实不直接支持padding和margin属性，实现间距小技巧

HarmonyOS鸿蒙Next中Span组件确实不直接支持padding和margin属性，实现间距小技巧

在遇到像商品列表里的图片标签在前面，后面跟着文案，文案换行之后还的与标签图片对齐的场景，如图：

还必须使用Text里嵌套

Text(){
  ImageSpan($r('app.media.startIcon')).width(10).height(10)
    .verticalAlign(ImageSpanAlignment.CENTER)
  Span('大理石清洁剂石英石厨房台面渗色清洁剂岩板石材去污')
}.layoutWeight(1)
.fontSize(12)

代码如：

Row() {
  Row(){
    Text(){
      ImageSpan($r('app.media.startIcon')).width(10).height(10)
        .verticalAlign(ImageSpanAlignment.CENTER)
      Span('占').fontSize(3).fontColor(Color.Transparent)
      Span('大理石清洁剂石英石厨房台面渗色清洁剂岩板石材去污')
    }.layoutWeight(1)
    .fontSize(12)
  }.width('50%')
  Row(){
    Text(){
      ImageSpan($r('app.media.startIcon')).width(10).height(10)
        .verticalAlign(ImageSpanAlignment.CENTER)
      Span('占').fontSize(6).fontColor(Color.Transparent)
      Span('大理石清洁剂石英石厨房台面渗色清洁剂岩板石材去污')
    }.layoutWeight(1)
    .fontSize(12)
  }.width('50%')
}