<p class="testText">这是一段实验文字,超出字数用...显示</p>
.textText{ width:50px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
当文本为多行文字时如下设置CSS
.box p{ width:400px; border:1px solid #ccc; margin:20px auto; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; }
注意 react中需要把
-webkit-line-clamp改为
WebkitLineClamp
-webkit-box-orient同理