css超出隐藏显示省略号(css文字省略号)

  在 mac 文件管理中有这样一个小细节。

image.png

  1.当文件名不超过一行时,完整显示,此时鼠标放上去无任何提示

  2.当文件名超过一行时,出现省略号,此时鼠标放上去提示显示完整文件名

  一个很微妙但非常人性化的细节(ps.都能完全看见也就不需要提示了)。其实这类效果在 web 中,通过简单的 CSS 也能轻易实现的。下面就来看看吧~

  由于文字内容的长度不确定性和页面布局的固定性,常常会遇到文字溢出的状况,有一下解决方法:

  1:规定文字父容器的宽高,设置超出隐藏:overflo:“hidde”

  2:css+div防止文字溢出,超出部分变成省略号。

  3:用jQuery限制字符字数。

  以上供参考,相关资料可查询。


发表评论

评论列表

还没有评论,快来说点什么吧~