收藏
回答

数字文本中含有数字1的文本在ios上的表现和安卓不一致,数字未对齐,详见截图

问题模块 框架类型 问题类型 终端类型 微信版本 基础库版本
框架 小程序 Bug 客户端 iOS 12.2 2.76

- 当前 Bug 的表现(可附上截图)

设备:iPhone Xs

问题:数字文本中含有数字1的文本在ios上的表现和安卓不一致,数字未对齐。通过硬编码,对文本数字中含有数字1的文本添加类名,给其数字增加间距,也不行。



- 预期表现

以下为安卓机上表现:

安卓表现正常


- 复现路径


- 提供一个最简复现 Demo


最后一次编辑于  07-16
回答关注问题邀请回答
收藏

3 个回答

  • 社区技术运营专员-小柿子
    社区技术运营专员-小柿子
    07-16

    麻烦提供能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    07-16
    赞同
    回复 3
    • 宇坤
      宇坤
      07-16
      https://developers.weixin.qq.com/s/SlfJBUmC7p9V
      07-16
      回复
    • 宇坤
      宇坤
      07-16
      在windows中的开发者工具上运行的表现正常,但在ios真机及mac下的开发者工具上表现未对齐,未设置font-family,取的系统font-family
      07-16
      回复
    • 宇坤
      宇坤
      07-19
      怎么没有下文了呢
      07-19
      回复
  • am1n0
    am1n0
    11-13

    把字体设为 -apple-system 并且在 font-feature-settings 添加 "tnum" 规则

    page {
        font-family: -apple-system, Helvetica, sans-serif;
        font-feature-settings: "tnum" 1;
    }


    11-13
    赞同
    回复
  • 小程序技术专员-LastLeaf
    小程序技术专员-LastLeaf
    07-19

    这个是正常现象。对于大部分字体,即使 font-size 相同,各个的字符占据的宽度是不太一样的。我们在不同的手机上使用这个机型的默认字体,所以如果你不指定 font-family ,就会有这种问题。


    如果需要各个的字符占据的宽度一致,请使用等宽字体( monospace )。

    07-19
    赞同
    回复 7
    • 宇坤
      宇坤
      07-22
      我指定了 font-family ,也有这个问题。稍后我试下用 monospace 看下真机效果。谢谢~
      07-22
      回复
    • 宇坤
      宇坤
      07-22回复宇坤




      刚试了使用  monospace 还是没用,问题依然存在

      07-22
      回复
    • 小程序技术专员-LastLeaf
      小程序技术专员-LastLeaf
      07-22回复宇坤
      有些设备上面 monospace 类可能有问题。试试直接指定一个实际字体,比如 Courier New
      07-22
      回复
    • 宇坤
      宇坤
      07-24回复小程序技术专员-LastLeaf
      可以了,多谢
      07-24
      回复
    • RuiLin
      RuiLin
      08-12回复宇坤
      你好,请问你最终是怎么解决的这个问题的呢?按照官方的建议,指定字体Courier New?
      08-12
      回复
    查看更多(2)