首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >数字跟文字一起被强制换行了?

数字跟文字一起被强制换行了?

作者头像
执行上下文
发布于 2023-07-24 16:47:00
发布于 2023-07-24 16:47:00
8020
举报
文章被收录于专栏:执行上下文执行上下文

小程序中,在文本渲染的时候。文字和数字在一起的时候,数字被强制换行了。数字并没有跟随在文字之后平滑换行。并且整个view是被设置了word-break: break-word; 在强制换行的时候并没有像预期结果一样。

效果如下:

一开始以为是 word-break: break-word的原因导致,可是将该属性去掉之后问题还是在。后来想起之前也因为一个文本的问题用过line-break,于是就试了试,发现可以很完美的解决上述问题。

但是在现在的移动端不会出现兼容问题,但是如果用于PC端在老的浏览器,如IE上面或者Edge上面可能会有兼容性问题,这个要注意一下。

解决方案可以通过CSS属性line-break: anywhere;来解决,解决后的效果如下:

代码语言:javascript
复制
  line-break语法如下:

auto:使用默认的换行规则。

loose:使用限制性最小的换行规则分隔文本。通常用于短行,如在报纸上。

normal:使用最常见的换行规则。

strict:使用最严格的换行规则。

anywhere:任意位置都可以作为换行点,包括任意的标点
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2023-04-07,如有侵权请联系 cloudcommunity@tencent.com 删除
目录
  • 效果如下:
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档