我想在三行之后截断一个长文本,但不包含三个点。
以下是不起作用的代码:
<html lang="en">
<style>
.truncateText{
height: auto;
width: 100px;
border: 1px solid red;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
<div class="truncateText">
This long text needs to be truncated without the three dots
</div>
</html>
谢谢!
设置等于3行文本的高度:
.truncateText {
--h: 1.2em; /* control the height */
line-height: var(--h); /* size of one line of text */
height: calc(3*var(--h));
width: 100px;
border: 1px solid red;
overflow: hidden;
}
<div class="truncateText">
This long text needs to be truncated without the three dots
</div>