p标签单行或多行超出显示省略号

单行省略

// 单行显示省略号
p {
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}

多行省略

-webkit-line-clamp: 3; 表示超出3行显示省略号，以此类推

// 多行显示省略号，数字3为超出3行显示，
p {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

展示图

在vue项目中 -webkit-box-orient: vertical;
这行一定要写在内联样式style=" -webkit-box-orient: vertical;"里面，
vue项目在打包后webpack会忽略这一行，所以你会发现在打包后的测试环境里面根本显示不了之前的控制两行显示并且超出显示省略号，我也是找了好久对比后才发现测试环境里这行没有显示，就没有效果，写在内联样式里就可以了。