超出隐藏

必须不是块级标签

 text-overflow: ellipsis; // 省略号代替溢出部分
  overflow: hidden;
  width: 100px;
  direction: rtl; /* 文本方向从右到左，使得最后一个字符显示出来 */
  // white-space:nowrap  防止换行  
  // text-overflow: clip; /* 默认情况下，文本超出容器会被裁剪 */

text-overflow: ellipsis; //省略号代替溢出部分
  overflow: hidden;
  width: 100px;

function ellipsis(str, maxLength) {
      if (str.length <= maxLength) {
        return str;
      } else {
        return str.substr(0, maxLength / 2) + '...' + str.substr(str.length - maxLength / 2);
      }
    }
ellipsis('sssssssssssssssssssssdddddd',10)

超出俩行隐藏...

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;

超出一行...

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