一、CSS3 过渡
transition
css3的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值
transition-property：检索或设置对象中的参与过渡的属性
transition-duration：检索或设置对象过渡的持续时间
transition-delay：检索或设置对象延迟过渡的时间
transition-timing-function：检索或设置对象中过渡的动画类型
贝塞尔曲线：
属性值：cubic-bezier()
贝塞尔曲线网址：http://cubic-bezier.com/
简写：transition:all/具体属性值 运动时间s/ms 延迟时间s/ms 动画类型
最简写：transition:运动时间s/ms
案例：悬停div,让p标签沿着x方向发生位移
二、CSS3 帧动画
animation
帧动画是通过一帧一帧的画面按照固定顺序和速度播放，如电影胶片。可通过设置多个节点来精确控制一个或一组动画，常用来实现复杂的动画效果。
语法：
第一步：先用@keyframes 制定运动动画的轨迹规则
@keyframes myMove{
from{初始状态属性}
to{结束状态属性}
}
或
@keyframes myMove{
0%{初始状态属性}
100%{结束状态属性}
}(中间再可以添加关键帧)
备注：mymove是给动画起的名字
>>本文地址：https://www.ujiuye.com/zhuanye/2019/48238.html
声明:本站稿件版权均属中公教育优就业所有，未经许可不得擅自转载。
1 您的年龄
2 您的学历
3 您更想做哪个方向的工作？
大前端
大数据
互联网营销
Java
Linux
Python
嵌入式
全域电商运营
软件测试
室内设计
平面设计
电商设计
网页设计
UI设计
VR/AR
网络安全
新媒体
直播带货
智能机器人
中公教育IT培训品牌
400-650-7353
Copyright©1999-
北京中公教育科技有限公司 .All Rights Reserved
京ICP备10218183号-88
京ICP证161188号
京公网安备11010802020723号
投诉建议：400-650-7353
Java培训
软件测试培训
Web培训
Linux培训
Python培训
互联网营销培训
UI培训
大数据培训
官方公众号 回复"大礼包"享福利 
领学习资料 分享IT知识 
阅读()
分享
手机端入口
