超出文本省略......

1.单行文本超出省略......

设置文本的宽度或高度，强制文本在一行，如：

width: 240px;                     //还可以设置高度，或者宽度为字符字数，如：width: 24em;

overflow: hidden;

text-overflow：ellipsis;      //省略号

white-space: nowrap;        //强制文本在一行，pre用等宽字体显示预先格式化的文 本，不合并文字间的空白距离，当文字超出边界 时不换行

-o-text-overflow: ellipsis;  

-ms-text-overflow: ellipsis;  

-moz-binding: url(assets/xml/ellipsis.xml#ellipsis);

2.多行文本超出省略.....（此方法还有些浏览器不支持）

设置文本的行数即可，如：

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;  //必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。

-webkit-line-clamp: 2;   //文本显示行数，2行文本

-webkit-box-orient： vertical；             //必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式

3.多行文本超出.....(js方法)

<script>
function nsubstr(str,len){  //参数开始位置和长度
  if(str.length>10){ //长度大于10
   return str.substring(0,len)+"...";
 }else{
   return str;
  }
}
</script>

<div><script>document.write(nsubstr("hello world!my name is lili",10));</script></div>