前言
有几次写前端代码的时候遇到了这种情况,就是后台传来的某个字段内容很长,页面上不能展示那么长的东西,一般一行或者两行字后就用一个…代替,相信很多人都见过,每次都要去找,挺麻烦的,在此记录一下。
一行+…
一行文字后加…需要写三行代码。如下所示。
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
两行+…
两行文字后加…需要写四行代码。如下所示。
display:-webkit-box;
overflow:hidden;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
最后一行的数字表示需要第几行显示…就写几
结束语
只是用于记录小知识点,方便再次查看。
如需转载,请标明出处,谢谢。