js 文字超出长度用省略号代替,鼠标悬停并以悬浮框显示实例

原创于 2018-03-19 15:29:08 发布 · 5.6k 阅读

CC 4.0 BY-SA版权

48 篇文章

订阅专栏

本文介绍了一种通过限制div宽度并使用title属性实现鼠标悬浮显示完整文本的方法。这种方法适用于需要展示额外信息但又不想占用过多页面空间的场景。

<div style='width:120px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;' title='鼠标悬浮显示的内容'>鼠标悬浮显示的内容</div> 

<!--这个内容因为是在div里面，是控制div的宽度来显示你需要看到几个字的长度，超出会显示 ...-->

效果：