单行文本和多行文本省略号

参考：
CSS换行文本溢出显示省略号
多行文本溢出

1. 单行文本

{
   width: ……;
   white-space: nowrap;  
   overflow: hidden;  
   text-overflow: ellipsis;
}

2. 多行文本

• 跨浏览器兼容的解决方案

p {
    position:relative;
    line-height:1.4em;
    /* 3 times the line-height to show 3 lines */
    height:4.2em;
    overflow:hidden;
}
p::after {
    content:"...";
    font-weight:bold;
    position:absolute;
    bottom:0;
    right:0;
    padding:0 20px 1px 45px;
    background:url(http://css88.b0.upaiyun.com/css88/2014/09/ellipsis_bg.png) repeat-y;
}

• 适用于移动端的解决方案

p {
    width:150px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}