摘要:预期目标文字最多显示两行,超出两行的省略号显示实现方案测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数
预期目标:文字最多显示两行,超出两行的省略号显示
实现方案:`
测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据
`
最终效果:
细节描述:
text-overflow:ellipsis 控制省略号
-webkit-line-clamp:2 控制行号
感觉对你有用的话,打赏一下哈:
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/116183.html
摘要:预期目标文字最多显示两行,超出两行的省略号显示实现方案测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数据测试数 预期目标:文字最多显示两行,超出两行的省略号显示实现方案:` .main{ width: 360px; borde...
摘要:我现在的需求是这样的,我目前实现了一个框,显示文字,超出两行显示,如果单行要保证垂直居中,我如果给容器使用则当文字内容过多的时候会不上下文字有截断现在效果如下只能显示两行,超出显示省略号解决方法垂直居中的我现在的需求是这样的,我目前实现了一个div框,显示文字,超出两行显示...,如果单行要保证垂直居中,我如果给容器使用display:flex;align-items:center;则当文字...
摘要:看到了个问题,问题地址目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。 看到了个问题,问题地址:https://segmentfault.com/q/10...目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。 ...
摘要:看到了个问题,问题地址目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。 看到了个问题,问题地址:https://segmentfault.com/q/10...目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。 ...
阅读 3606·2021-11-15 11:37
阅读 2973·2021-11-12 10:36
阅读 4400·2021-09-22 15:51
阅读 2379·2021-08-27 16:18
阅读 880·2019-08-30 15:44
阅读 2161·2019-08-30 10:58
阅读 1766·2019-08-29 17:18
阅读 3267·2019-08-28 18:25