记一下永远背不下来的单行省略和多行省略代码

Posted nangras

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了记一下永远背不下来的单行省略和多行省略代码相关的知识,希望对你有一定的参考价值。

单行省略:

white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;

 

多行省略:

 overflow: hidden;
    max-height: 44px;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-break:break-word;
    /* autoprefixer: off */
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    /* autoprefixer: on */
 
 
(注释掉的部分是为了保证编译时这种旧代码不丢失)

以上是关于记一下永远背不下来的单行省略和多行省略代码的主要内容,如果未能解决你的问题,请参考以下文章

单行溢出和多行溢出显示省略号

文本超出---单行省略和多行省略

CSS实现单行多行文本溢出显示省略号(…)

CSS实现单行多行文本溢出显示省略号(…)

文本溢出显示省略号

纯 CSS 自定义多行省略:从原理到实现