html 纯数字、英文不换行的两种解决办法

最新推荐文章于 2024-09-14 16:44:43 发布

清音啊

最新推荐文章于 2024-09-14 16:44:43 发布

阅读量1.3k

点赞数

分类专栏： html 前端微信公众号网页开发文章标签： html canvas 纯数字、英文不换行的解决办法

本文链接：https://blog.csdn.net/qq_38839887/article/details/111028662

版权

前端同时被 3 个专栏收录

34 篇文章 0 订阅

订阅专栏

html

6 篇文章 0 订阅

订阅专栏

微信公众号网页开发

3 篇文章 0 订阅

订阅专栏

1.在需要纯数字或英文换行的标签加入样式：word-break: break-all;//强制换行

2.如果需要将html代码通过html2canvas转为图片,word-break: break-all;结果失效；我的解决办法是将纯数字使用substring截取字符串，

var kaohao = "202012131021111";
var str1 = kaohao.substring(0,8);
var str2 = kaohao.substring(8);
var html = '<text style="">'+str1+'</text><text style="color:#FFF;font-size:0rem;">-</text><text style="">'+str2+'</text>';
$('#kaohao').html(html);//将变换格式的新标签插入到需要纯数字换行的标签

重点是<text style="color:#FFF;font-size:0rem;">-</text>这个哦！

*如果伙伴们还有其他更好的实现方式，评论里留言我哈！