代码：overflow: hidden; text-overflow: ellipsis;

overflow: hidden;//当容器中的内容超出容器的尺寸时，将隐藏超出部分而不显示滚动条。

  display: -webkit-box;//使用WebKit引擎的浏览器（如Chrome和Safari）中，将容器的显示方式设置为弹性盒子布局。

  -webkit-line-clamp: 1;//在WebKit引擎的浏览器中，限制文本内容显示的行数为1行。这样，如果文本内容超出一行，超出部分将被隐藏。

  -webkit-box-orient: vertical;//在WebKit引擎的浏览器中，将弹性盒子的主轴方向设置为垂直方向。这样，文本内容将按照垂直方向进行布局。

  text-overflow: ellipsis;//当文本内容超出容器的尺寸时，显示省略号（...）来表示被隐藏的部分。

效果：