css实现单行或多行文字过长自动隐藏功能

单行

overflow: hidden; text-overflow: ellipsis; white-space: nowrap;

多行(兼容各个浏览器)//通过覆盖最后几个字的形式

.p {position:relative;line-height:1.4em;height:4.2em;overflow:hidden;}
.p::after {content:"...";font-weight:bold;position:absolute;bottom:0;right:0;padding:0 20px 1px 45px;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%);}

效果如下