多行文字两行断尾点点点显示

在工作中遇到一个需求,要求标题内容两行断尾点点点显示,现将方法记录如下:
css样式:

 p{
             200px;
            margin:0 auto;
            border:1px solid #ccc;
            font-size: 20px;
            -webkit-line-clamp: 3;    /*用来限制在一个块元素显示的文本的行数*/
            display: -webkit-box;    /*必须结合的属性,将对象作为弹性伸缩盒子模型显示*/
            -webkit-box-orient: vertical;    /*必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式*/
            overflow: hidden;/*必要*/
        }

直接给块级元素加上以上样式,就可以实现了,效果如下:
这里写图片描述

原文地址:https://www.cnblogs.com/gaos/p/7767383.html