本文探讨了在CSS中如何处理折叠区域的高度自动撑开问题。通过设置max-height而非固定高度，可以实现展开效果，但在折叠时遇到问题。通过添加min-height属性，最终成功创建了一个能够正确展开和折叠的面板。这个技巧对于动态内容展示和用户体验优化至关重要。
1.当我们希望实现折叠区域 根据内容的高度 自动撑开时，设置height：auto，transition动效没有生效（当把高度修改为固定值时是可以的）
2.此时，我们可以设置一个最大高度，max-height（超过你的内容高度的一个值，我这边设置为214px），此时我们发现展开已生效，但关闭的折叠效果没有生效
3.我们可以设置一个最小高度，min-height，这样折叠面板的功能就实现了，一起试试吧
手动实现折叠面板效果，height:auto时，导致transition失效
扫一扫
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
