小程序设置文字单行多行超出省略显示

我在开发小程序的时候经常遇到这么一个需求就是文字超出范围后自动省略不显示!那么该如何设置呢?下面小编就将方法分享给大家,供大家参考学习!

东西/原料

  • 电脑:win7,64位
  • 软件应用:微信开辟者东西

方式/步调

  1. 1

    和日常工作一样啦,起首打开【开辟东西】

  2. 2

    打开辟开东西后,新建一个页面并建立两段文字(这里是便利演示,大师忽略!)

  3. 3

    打开CSS文件设置单行省略结果!

    代码:

    .demo1 {

    display: block;

    width: 100%;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    }

  4. 4

    设置多行省略结果!

    代码:

    .demo2 {

    width: 100%;

    display: -webkit-box;

    word-break: break-all;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 2;

    overflow: hidden;

    text-overflow: ellipsis;

    }

  5. 5

    最好我们来看看整体结果吧

    END

注重事项

  • tips1:为了赐顾帮衬到更多的人写的比力具体,大神请直接看步调三,步调四!
  • tips2:本教程由小编原创,有什么不大白的可以留言评论!感觉不错就给小编点赞!
  • 发表于 2020-03-20 17:00
  • 阅读 ( 1370 )
  • 分类:其他类型

相关问题

0 条评论

请先 登录 后评论
admin
admin

0 篇文章

作家榜 »

  1. xiaonan123 189 文章
  2. 汤依妹儿 97 文章
  3. luogf229 46 文章
  4. jy02406749 45 文章
  5. 小凡 34 文章
  6. Daisy萌 32 文章
  7. 我的QQ3117863681 24 文章
  8. 华志健 23 文章

联系我们:uytrv@hotmail.com 问答工具