美文网首页
css 实现多行文本省略号,单行文本省略号

css 实现多行文本省略号,单行文本省略号

作者: 前端人 | 来源:发表于2021-06-11 16:44 被阅读0次

    1.实现多行文本省略号

              max-height:xxxx ;//设置最大高度
              max-width:xxxx;//设置最大宽度
              overflow: hidden;
              text-overflow: ellipsis;
              display: -webkit-box;
              -webkit-line-clamp: 2;//容许几行
              -webkit-box-orient: vertical;
               word-break: break-all;//让英语单词数字可以折断显示
    

    单行文本:

    max-width:xxxx;//设置最大宽度
    white-space:nowrap;// 强制一行
    overflow:hidden; 
    text-overflow:ellipsis;
     word-break: break-all;//让英语单词数字可以折断显示
    

    相关文章

      网友评论

          本文标题:css 实现多行文本省略号,单行文本省略号

          本文链接:https://www.haomeiwen.com/subject/bejveltx.html