index.html
<div class="list">
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>
</div>style.css
.list {
display: flex;
flex-direction: column;
max-height: 200px !important;
overflow: auto;
min-height : 115px;
}在上面的代码中，ul标签中li项的数量可能会发生变化，因此我希望只保留div的高度，以便完整显示li标签如何根据li元素的数量和它们占用的空间动态更改高度
2条答案
按热度按时间fzwojiic1#
尝试将max-height添加到您正在使用的类的css中。
z6psavjg2#
从
.list中删除max-height，您将得到默认的CSS行为-您添加的项目越多，高度自动增长的越多。一般来说，显式设置height是不必要的，有时候是有害的，内容应该向下增长并垂直滚动。有时候需要显式设置高度，通常是在处理图像时。例如，当制作一个carousel时，你会希望它有特定的height，即使这样，有一个max-height可能会更好（不要强迫图像拉伸）。