移动端奇葩的多行文字省略隐藏

Posted 前端一年级

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了移动端奇葩的多行文字省略隐藏相关的知识,希望对你有一定的参考价值。

white-space: nowrap;

这个属性表示规定段落中的文本不进行换行;


在项目中
font-size:0.6rem;

text-overflow: ellipsis;(超出行用省略号...表示)

这样设置,查看box中的height发现高度是17px
而不超出行宽,height高度18px
这样导致 float:left 向左浮动不能对齐

所以这里做了一个解决办法
设置 min-height值


以上是关于移动端奇葩的多行文字省略隐藏的主要内容,如果未能解决你的问题,请参考以下文章

多行文字溢出显示省略号

td文字溢出显示省略号

控制容器文字行数(pc和 移动端)

如何实现移动端点击下拉箭头显示全部文字

文字打点

适配移动端的文字超出隐藏并添加省略号