单行文本溢出显示省略号---（前提要给固定宽度）
实现方法:
overflow:hidden; /*--超出隐藏--*/
white-space:nowrap; /*--禁止换行--*/
text-overflow:ellipsis; /*--超出的文字以省略号显示--*/
显示效果：
多行文本溢出显示省略号
实现方法:
display:-webkit-box; /*--课伸缩盒子/弹性盒子--*/
-webkit-box-orient:vertical;/*--从上向下垂直排列子元素--*/
-webkit-line-clamp:3;/*--限制在一个块元素显示的文本的行数(超出3行显示省略号)--*/
overflow:hidden;
适用范围：
因使用了WebKit的CSS扩展属性，该方法适用于WebKit浏览器及移动端
兼容写法:（通过定位的方式）
p{
width:200px;/*自己定义宽度*/
position: relative;
line-height: 20px;/*行高*/
max-height: 40px;/*这里是是行高的几倍就表示显示几行文本*/
overflow: hidden;
}
p::after{
content: "...";
position: absolute;
bottom: 0;
right: 0;
padding-left: 40px;
background: -webkit-linear-gradient(left, transparent, #fff 55%);
background: -o-linear-gradient(right, transparent, #fff 55%);
background: -moz-linear-gradient(right, transparent, #fff 55%);
background: linear-gradient(to right, transparent, #fff 55%);
}
显示效果：