Javascript 通过页面加载上的动画增加ul自动高度

我是新蜜蜂。我想做一个ul增加页面加载动画的自动高度。在css中可能吗？请帮帮我

<ul>
    <li><a href="/">title 1</a></li>
    <li><a href="/">title 2</a></li>
    <li><a href="/">title 3</a></li>
    <li><a href="/">title 4</a></li>
    <li><a href="/">title 5</a></li>
</ul>

实际上，您完全可以在CSS中实现这一点，从而保持严格和适当的关注点分离这意味着所有样式都保持在CSS的边界/范围内：

ul{
最大高度：0；
溢出：隐藏；
动画名称：成长；
动画填充模式：正向；
动画持续时间：2秒；
-webkit动画名称：grow；
-webkit动画持续时间：2秒；
-webkit动画填充模式：正向；
}
@关键帧增长{
从{
最大高度：0
}
到{
最大高度：200px
}
}
@-webkit关键帧增长{
从{
最大高度：0
}
到{
最大高度：200px
}
}

这是可能的，但您可能想做其他事情。可以设置从一个值到下一个值的高度动画。我想你在本教程中看到了@SureshKumar-很简单，您需要将

高度

更改为

最大高度

，在上面，只需将

200px

替换为可预见的最大潜在高度。请注意，元素不会增长到该高度，它只会增长到其内容所需的高度，达到该值。因此，元素只会随着其内容的增加而增长。