【前端学习笔记day41】6.4. CSS3 transition动画

6.4. CSS3 transition动画

在这里插入图片描述

CSS3 transition动画

1、transition-property 设置过渡的属性,比如:width height background-color
2、transition-duration 设置过渡的时间,比如:1s 500ms
3、transition-timing-function 设置过渡的运动方式,常用有 linear(匀速)|ease(缓冲运动)
4、transition-delay 设置动画的延迟
5、transition: property duration timing-function delay 同时设置四个属性

综合练习:

制作鼠标移入图片时,图片说明滑入的效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5M5JkBnE-1580379642235)(images/pic_mask_slide.png)]

发布了335 篇原创文章 · 获赞 148 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/qq_35456045/article/details/104117359