css超出部分省略

1.单行：

.div1{

width:100px;

overflow: hidden;  // 内容会被修减，并且其余内容是不可见

text-overflow: ellipsis; // 显示省略号来代替被修减文本

white-space: nowrap; //文本不换行

}

2.多行：

.div2{

width: 100px;

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

-webkit-line-clamp: 3 // 设置多少行

-webkit-box-orient: vertical  // 设置盒模型排列方式

overflow: hidden;  // 内容会被修减，并且其余内容是不可见

text-overflow: ellipsis; // 显示省略号来代替被修减文本

}

vue中多行注释需要添加

/* autoprefixer: ignore next */

-webkit-box-orient: vertical;

否则失效。。