指定行数多余文字省略展示样式

原创于 2022-09-15 14:43:06 发布 · 224 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #html #前端

css 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一种CSS技术，用于限制文本显示在一行内并隐藏超出部分，同时展示了如何使用`-webkit-line-clamp`属性来控制最多显示的文本行数，这对于网页设计中控制长文本的显示非常有用。

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

  display: -webkit-box;
  max-width: 400px;  // 指定最大的宽度
  overflow: hidden;
  white-space: break-spaces;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;  // 指定最多多少行展示
  -webkit-box-orient: vertical;

指定行数 多余文字省略展示样式

指定行数多余文字省略展示样式