拜托,css这样实现多行文本“展开收起” 超酷的好吧
发布网友
发布时间：2024-10-24 07:25
共1个回答
热心网友
时间：2024-10-25 14:05
前言
无法言语，我是什么，这样傻傻的我怎么守护你
这次我静静哭了选择放弃，我好想好想把记忆折叠起
可惜，记忆不能像之前那个需求一样自由展开与折叠
需求如下所述：
未展开
展开
未展开
展开
我第一次做这种需求，于是就网上搜索案例，找到一个点赞和评论都挺多的方案。
但发现有些问题，于是我向设计大佬询问，得到了拒绝。
在寻求网友帮助时，一位大佬提供了另一方案。
这个方案与上面介绍的那篇文章的方法差不多，不同点在于利用div高度文字显示的行数。
然而，在安卓和ios设备上发现此方案存在问题，ios上显示行数时会出现额外半行显示或对齐不一致。
结合两者的优点，我设计了新的方案。
使用input记录当前展开或收起状态，并利用两个label按钮实现不同情况下的文字显示。
关键在于判断文字是否超过2行和7行，通过获取文字实际高度。
回忆从前，我的心总是默默的等候
你曾经说你 想找一个依靠
等了好几天 等你的留言 却发现是空白一片
站在镜子前 是不是我的样子有点丑
