css设置显示显示指定行数；css设置只显示一行，超出部分...

最新推荐文章于 2025-06-23 15:06:29 发布

小米李

最新推荐文章于 2025-06-23 15:06:29 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

文章标签： css 省略号显示文字超出一行指定行数

本文链接：https://blog.youkuaiyun.com/Sunny_lxm/article/details/128661358

这篇文章介绍了如何使用CSS来限制文本显示的行数，例如只显示指定的行数如4行，并对超出的部分使用省略号隐藏。主要涉及的CSS属性有word-break、-webkit-line-clamp、-webkit-box-orient、overflow以及white-space、nowrap和text-overflow的组合使用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

css设置显示显示指定行数：
word-break:break-all;
display:-webkit-box;
-webkit-line-clamp:4; // 只显示4行。超出...显示
-webkit-box-orient:vertical;
overflow:hidden;

css设置只显示一行，超出部分...：

white-space: nowrap; 
overflow: hidden;
text-overflow:ellipsis;