css写一个动画让div元素的高度慢慢从上往下展示全部
时间: 2023-06-02 21:04:41 浏览: 60
可以使用CSS3中的transition属性和height属性来实现该动画效果:
1.先设置div元素的初始高度为0,overflow:hidden;
2.在:hover状态下,将height属性设置为div元素的实际高度。
示例代码如下:
HTML代码:
<div class="box">Hello World</div>
CSS代码:
.box {
height: 0;
overflow: hidden;
background-color: #f3f3f3;
transition: height 0.3s ease;
}
.box:hover {
height: auto;
}