css文字溢出处理方式(单行和多行)

单行文字溢出

250px;
overflow:hidden; /* 移除隐藏 */
text-overflow: ellipsis; /* 省略号 */
white-space: nowrap; /* 禁止文字自动换行 */

多行溢出

200px;
overflow:hidden; /* 溢出隐藏 */
display: -webkit-box;  /* 老版弹性盒子,存在浏览器兼容问题,需要添加-webkit,表示内容在水平方向上的排放 */
-webkit-line-clamp: 2; /* 溢出的行数 */
-webkit-box-orient: vertical; /* 规定内容水平排放 */

单行文字和多行文字溢出,经常使用在列表页的文章标题中,固定标题显示的行数,鼠标悬浮的时候,看到完整的标题内容

原文地址:https://www.cnblogs.com/ranyihang/p/14927455.html