84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
现在设计稿是这样的,里面支持1-6个字,垂直水平居中。
文字和图片都是读接口拿的。
难点来了,四个字的时候,两个字就换行了,五个字的时候,两个字换行,下面有三个字,六个字的时候,是三个字换行。如果我给文字区限定范围那他肯定是先上面三个字,再下面两个字。有没有布局大神帮忙解决一下?
文字调用这个函数处理一下呗
function linefeed(text) { var l = text.length; if (l <= 3) { return text } var cut = Math.floor(l/2); return text.slice(0, cut) + '<br>' + text.slice(cut) }
文字和图片都是接口拿的
那直接在 js 里面做逻辑判断啊,为什么要用 css 解决
样式设置
p { white-space: nowrap }
然后在取回的数据中,判断文字长度,大于二就在第二个文字后面加<br>换行符
用flex垂直水平剧中以后可以单独设置文字p大小
用js添加换行符
wrap-reverse 可以第一行和第二行倒置
文字调用这个函数处理一下呗
那直接在 js 里面做逻辑判断啊,为什么要用 css 解决
样式设置
然后在取回的数据中,判断文字长度,大于二就在第二个文字后面加<br>换行符
用flex垂直水平剧中以后可以单独设置文字p大小
用js添加换行符
wrap-reverse 可以第一行和第二行倒置