如何使文本溢出多行，其中最后一行有省略号而不仅仅是第一行？[重复]
发布于2025-01-19 22:35 阅读(228) 评论(0) 点赞(21) 收藏(0)
如何使用文本溢出使“div”中的最后一行只带有省略号？因此，在 div 中，行末换行，最后一行必须带有省略号。另一个问题是，字母不是整行换行的。我得到的字母支离破碎。我需要在行末得到完整的字母。在垂直上下文中结束整行。
.someclass {
width: 200px;
height:200px;
overflow: hidden;
text-overflow: ellipsis;
}<div class="someclass">
AAAAAA
</div>
解决方案
为此，您可以使用line-clamp，检查下面更新的代码片段...
在使用此解决方案之前，请检查浏览器支持
body {
line-height: 1.5;
}
.box {
background-color: #ddd;
padding: 2em;
width: 200px;
}
.box p {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}<div class="box">
<p>Hey, don't cut me off like that. I want to speak my mind and don't appreciate being put into a box.</p>
</div>所属网站分类: 技术文章 > 问答
作者：黑洞官方问答小能手
链接：http://www.qianduanheidong.com/blog/article/538954/1ee08baae00c9932ea72/
来源：前端黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
昵称:
评论内容：(最多支持255个字符)
---无人问津也好，技不如人也罢，你都要试着安静下来，去做自己该做的事，而不是让内心的烦躁、焦虑，坏掉你本来就不多的热情和定力