css文本截字，超出文本省略号显示

一、单行文本截字

p {
    text-overflow: ellipsis;/*显示省略号代替裁剪的文本*/
    white-space: nowrap;/*空白处理方式 不换行*/
    overflow: hidden;/*溢出隐藏*/
}    

效果：

二、多行文本截字

p{
    display:-webkit-box;/*设置盒子为弹性盒容器*/
    -webkit-box-orient:vertical;/*设置盒子内部排列方式为垂直排列*/
    -webkit-line-clamp:2;/*显示两行*/
    text-overflow:ellipsis;/*用省略号代替才建的文字*/
    overflow:hidden;/*溢出隐藏*/
    /*若为纯字母、数字，需要加上下面这句*/
    word-break:break-all;
}

效果

原文地址：https://www.cnblogs.com/zjp-/p/9005936.html