公告列表
公告列表
收藏
回答

Skyline 内联 inline-flex 无法生效

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 微信iOS客户端 8.43.5 3.8.6

skyline 下 无法实现内联方案， 我想实现 下面的效果， 无法实现。


采用 <text></text> 嵌套可以实现行内标签，但是里面的 text 无法实现 padding 、width 等功能，因为不是块级机构， 即便声明了 inline-block，也没有用， 我不知道如何上线上述效果， 不会用 span 标签 嵌套 image ？？


https://developers.weixin.qq.com/s/CpbwDqmm8X2O
回答关注问题邀请回答
收藏

3 个回答

  • 社区技术运营专员-Jahozheng
    社区技术运营专员-Jahozheng
    2025-09-08

    2025-09-08
    有用
    回复 3
    • public
      public
      发表于小程序端
      2025-11-20

      渲染默认 webview 是可以的，skyline不行

      2025-11-20
      赞
      回复
    • 社区技术运营专员-Jahozheng
      社区技术运营专员-Jahozheng
      2025-11-21回复public
      前面后面内容都变成inline-flex呢
      2025-11-21
      赞
      回复
    • public
      public
      01-09
      感谢你的方案，在不换行的情况下是可以满足预期的， 只是前后内容都变成 inline-flex 若出现溢出换行的场景标签就很怪异，因为它依赖于 flex-wrap：wrap  和 自身的宽度，导致无法实现自适应（skyline 特性?）， 所以后续 使用 span 标签  + text  +  inline-block 来实现，虽然 在 windows 微信开发者工具下 短文本无法拼接在一起，但是在真机上是正常的，长文本都正常，如下图所示，相关链接： https://developers.weixin.qq.com/s/9Otzg1me8h6E
      01-09
      赞
      回复
  • public
    public
    01-09

    解决方案

    # span 标签 + text 标签 + inline-block  来实现

    解决以下问题

    https://developers.weixin.qq.com/s/7ltds1mL8M6e

    1. 未换行场景下支持在同行显示；（虽然开发者工具未在同一行，但真机可以）
    2. 换行场景下支持自适应宽度 （虽然开发者工具看不到 图标，但是真机可以）

    <view style="padding-top: 20px; font-size: 20px; font-weight: 600; color: blue"> 使用 span 标签  inline-block 长文本 </view>
<span>
<text>前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文前文</text>
<view class="title-new" style="display: inline-block; ">new</view>
<text >后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文后文</text>
    01-09
    有用
    回复
  • 陈恒承
    陈恒承
    2025-12-31

    这样设置可以实现你想要的效果

    2025-12-31
    有用
    回复 1
    • public
      public
      01-09
      感谢你的回答，skyline 的 inline-flex 是有点怪怪的，长文本的情况下会导致异常，后续使用 span 标签 + text + inline-block  解决的，不然在 skyline 下 inline-flex 没办法实现依赖父级宽度的自适应换行。 另外在开发者工具上表现也是奇奇怪怪，真机上符合预期.
      01-09
      赞
      回复
请 登录 后发表内容
相关文档