1.单行文本
使用text-overflow：ellipsis属性
text-overflow: clip|ellipsis|string;
clip：修剪文本。
ellipsis：显示省略符号来代表被修剪的文本。
string：使用给定的字符串来代表被修剪的文本。
示例：
p{
overflow: hidden;/超出部分隐藏/
text-overflow:ellipsis;/* 超出部分显示省略号 /
white-space: nowrap;/规定段落中的文本不进行换行 /
width: 250px;/需要配合宽度来使用*/
border: 1px solid red;
font-size: 30px;
}
<p>单行文本超出部分显示省略号我是texttext 测试测试测试</p>
image.png
2.多行文本显示省略号，省略号后面一行
p{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3; //表示几行开始省略 可以改为2
overflow: hidden;
width: 250px;
border: 1px solid red;
font-size: 30px;
}
image.png
