css控制文字溢出...

1、单行文本 

利用overflow实现单行文字溢出...效果：

{
    text-overflow：clip|ellipsis|string; 
    white-space:nowrap;
    overflow:hidden;
}

clip: 直接修剪文本，文本末端可能会出现字符显示不全的现象。

ellipsis：用省略号来代替修剪的文本。

string: 用给定的字符串来代替修剪的文本（只在火狐浏览器有效）。

2、多行文本

{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-clamp: 3;
    overflow: hidden;
}

3、兼容性写法

p {
    position: relative;
    line-height: 20px;
    max-height: 40px;
    overflow: hidden;
}

p::after {
    content: '...';
    position: absolute;
    right: 0;
    bottom: 0;
    padding-left: 40px;
    background: -webkit-line-gradient(left, transparent, #fff 55%);
    background: -moz-line-gradient(right, transparent, #fff 55%);
    background: -o-line-gradient(right, transparent, #fff 55%);
    background: line-gradient(to right, transparent, #fff 55%);
}