列表元素应恰好显示 5 个项目

Question

我有一个包含 100 个元素的列表，但我只想用垂直滚动条一次显示 5 个元素。<li>没有固定的高度，可以根据其内容（从数据库中获取）而有所不同。问题是我可以保持固定的<ul>高度，它可以正常显示 5 个项目，但有时当 <li> 中的内容跨越多行时，最后一个元素会被推下。

所以问题是，有没有办法不使用javascript/jquery，其中<ul>的高度将始终等于包含<li>

Answer 1

这在 CSS 上可能是不可能的。仅当ul的高度不适合其内容时，才会弹出常规滚动条，仅当高度不依赖于其子级（在设计时具有未确定的高度）时，才会发生这种情况。

此外，滚动通常是"连续的"：您可以显示项目的某些部分。您似乎正在寻找更多"离散"滚动：向下"勾号"意味着顶部li被"滚动"走，下一个li被添加到底部。

我认为您应该寻找替代方案，无论是具有滚动条的固定高度li s，还是带有省略号的溢出和带有全文的弹出窗口的组合，或者一些JavaScript解决方案。