美文网首页
自动隐藏过长文本

自动隐藏过长文本

作者: George_Antonio | 来源:发表于2018-07-05 12:05 被阅读0次

开发中遇到了类似于个人简介等文本过长的情况, 规定文本显示两行。 过长文本隐藏并用省略号表示。

  • overflow:hidden : 超出的文本隐藏

  • text-overflow:ellipsis : 溢出用省略号显示

  • display:-webkit-box

  • webkit-box-orient:vertical :伸缩盒子的子元素排列方式, 垂直

  • webkit-line-clamp:2 : 设置显示的行数。

如果是一行的话:将后面三个属性换为:white-space:nowrap; //溢出不换行。

相关文章

网友评论

      本文标题:自动隐藏过长文本

      本文链接:https://www.haomeiwen.com/subject/zftpuftx.html