CSS动画和显示无

CSS动画和显示无

CSS（或jQuery）无法在

display: none;

和之间设置动画

display: block;

。更糟糕的是：它无法在

height:0

和之间创建动画

height:auto

。因此，您需要对高度进行硬编码（如果无法对值进行硬编码，则需要使用javascript，但这是一个完全不同的问题）；

#main-image{    height: 0;    overflow: hidden;    background: red;   -prefix-animation: slide 1s ease 3.5s forwards;}@-prefix-keyframes slide {  from {height: 0;}  to {height: 300px;}}

您提到您正在使用Animate.css（我不熟悉），因此这是普通CSS。