javascript - css布局问题,可以用flex
曾经蜡笔没有小新
曾经蜡笔没有小新 2017-05-19 10:22:11
0
6
557

  • 现在设计稿是这样的,里面支持1-6个字,垂直水平居中。

  • 文字和图片都是读接口拿的。

  • 难点来了,四个字的时候,两个字就换行了,五个字的时候,两个字换行,下面有三个字,六个字的时候,是三个字换行。如果我给文字区限定范围那他肯定是先上面三个字,再下面两个字。
    有没有布局大神帮忙解决一下?

曾经蜡笔没有小新
曾经蜡笔没有小新

全部回复(6)
phpcn_u1582

文字调用这个函数处理一下呗

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)
}
Ty80

文字和图片都是接口拿的

那直接在 js 里面做逻辑判断啊,为什么要用 css 解决

过去多啦不再A梦

样式设置

p {
    white-space: nowrap
}

然后在取回的数据中,判断文字长度,大于二就在第二个文字后面加<br>换行符

PHPzhong

用flex垂直水平剧中以后可以单独设置文字p大小

習慣沉默

用js添加换行符

过去多啦不再A梦


wrap-reverse 可以第一行和第二行倒置

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!