css div向左滑过后消失
时间: 2023-07-24 20:39:32 浏览: 168
点击div以外的部分,div消失不见
你可以使用CSS3中的`@keyframes`和`animation`属性来实现这个效果,具体实现方法如下:
1.在CSS中定义`@keyframes`,实现向左滑动的动画效果:
```
@keyframes slideout {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-100%);
}
}
```
2.使用`animation`属性将动画应用到需要消失的`div`上,并设置动画持续时间、动画名称和动画运动曲线:
```
.div-to-disappear {
animation: slideout 1s ease-in-out;
}
```
这样,当你将这个CSS类应用到需要消失的`div`上时,它就会向左滑动并消失了。
阅读全文