多余文字隐藏用省略号代替

一，多行文字隐藏用省略号代替
border:1px solid #ddd;
width: 200px;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; /** 将对象作为伸缩盒子模型显示 /
-webkit-box-orient: vertical; / 设置或检索伸缩盒对象的子元素的排列方式 /
-webkit-line-clamp: 3; / 显示的行数 /
overflow: hidden; / 隐藏超出的内容 */
二，单行文字隐藏用省略号代替
width: 50px;
height: 5px;
overflow: hidden;
white-space:nowrap;/不显示的地方用省略号…代替/
text-overflow:ellipsis;/ 支持 IE */
-webkit-line-clamp: 3;
三，但是在React项目之中不生效是因为在react编译后没有-webkit-box-orient: vertical;
解决方法是添加行内样式：

<p style={{"WebkitBoxOrient": "vertical"}}>
   React多行文本省略
</p>