1.单行文本
p {overflow: hidden;/*超出部分隐藏*/text-overflow:ellipsis;/* 超出部分显示省略号 */white-space: nowrap;/*规定段落中的文本不进行换行 */width: 250px;/*需要配合宽度来使用*/}
2.多行文本显示省略号,省略号在段尾
p{display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
Tips:
// vue 中不会报错text-overflow:ellipsis;text-overflow:-o-ellipsis-lastline;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;
// 多行超出省略号不生效解决办法:text-overflow:ellipsis;display:-webkit-box;/*!autoprefixer:off*/-webkit-box-orient:vertical;/*autoprefixer:on*/-webkit-line-clamp:3;overflow:hidden;