我试图在 div 块中显示长文本，并且希望如果文本超过 div 高度，则需要显示“...”，否则将整个文本填充到块中。但问题是，使用 css text-overflow:ellipsis 会将整个长文本切割成一行文本，并将这些点放置在可以写入更多文本的下方空间中。
<div class="hide-long-text">
现在很长呜呜呜呜呜呜呜呜呜呜呜呜
.hide-long-text {
height: 80px;
width: 110px;
border: 1px solid #adb8c0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
这是一个提琴手link 有人可以给我一个提示，我可以如何使用这个可用空间，当文本超过 div 高度时显示“...”
【问题讨论】：
请试一下代码：
<head>
<meta charset="UTF-8">
<title></title>
<style>
div {
width: 200px;
height: 100px;
line-height: 20px;
word-break: break-all;
background-color: skyblue;
display: -webkit-box;
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-box-orient: vertical;
box-orient: vertical;
-webkit-line-clamp: 5;
-moz-line-clamp: 5;
-ms-line-clamp: 5;
line-clamp: 5;
overflow: hidden;
}
</style>
</head>
<body>
<div> hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!hello,world!</div>
</body>【讨论】：