更新时间:2023-12-04 12:38:52
您可以使用 text-overflow:ellipsis
height
。
像这样
.truncate
{
width:250px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
height:100px;
}
通过使用文本溢出,可以显示您的输出而不使用javascript。 / p>
来源
新更新
可以使用此方法。
css
.classname:after {
content:\02026 ;
}
我认为可能有用的几个链接
Is there a CSS-only way (no JavaScript/jQuery) to only show the first two lines and, if there are three or more lines, hide the extra lines and show an ellipsis?
For example, how can I take this fiddle:
...and make it look like this?
Lorem Ipsum Dolor
Sit Amet Consectetur
Ut Enim Ad Minim
Veniam Quis Nostrud...
Duis Aute Irure
Dolor In...
Thanks in advance.
You can use text-overflow:ellipsis
property with height
.
Like this
.truncate
{
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height:100px;
}
By using text-overflow, you can display your output without using javascript.
Sources
To Learn more about truncating. Read this link
New Update
For multiline ellipsis you can use this method.
css
.classname:after{
content: "\02026";
}
Few Links which i think might be useful