纯CSS能实现吗?
<div style=" overflow: hidden;text-overflow:ellipsis; width: 150px; height: 16px;font-size:12px;line-height:16px;">我跑过三行后想被省略后留下痕迹。我跑过三行后想被省略后留下痕迹。我跑过三行后想被省略后留下痕迹。我跑过三行后想被省略后留下痕迹。我跑过三行后想被省略后留下痕迹。我跑过三行后想被省略后留下痕迹。
</div>
以上不会出现省略...
这个是用css是可以实现的,不过需要给定宽高
display:-webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
纯CSS是很不容易做到的。我收藏过一个相当何弃疗的办法,我相信你不想这么做。
老老实实的用js吧 :)
参考 MDN 的这篇文章: https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow
多行的话,参考这个,也是不用脚本的: http://www.mobify.com/blog/multiline-ellipsis-in-pure-css/