文本末添加省略号

本文主要是介绍文本末添加省略号，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

当文本的内容超出容器的宽度的时候，我们希望在其默认添加省略号以达到提示用户内容省略显示的效果。

宽度固定，适合单行显示…

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

宽度不固定，适合多行以及移动端显示

overflow: hidden;
text-overflow: ellipsis; // 溢出用省略号显示
display: -webkit-box; // 将对象作为弹性伸缩盒子模型显示。
-webkit-line-clamp: 3;  // 表示显示的行数。
-webkit-box-orient: vertical; // 从上到下垂直排列子元素（设置伸缩盒子的子元素排列方式）

这篇关于文本末添加省略号的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---