博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
css3旋转、过渡、动画属性
阅读量:7220 次
发布时间:2019-06-29

本文共 561 字,大约阅读时间需要 1 分钟。

1、transform

该属性对元素进行旋转、缩放、移动和倾斜

translate元素从当前位置移动

rotate元素顺时针旋转

scale元素的尺寸增大或减小

skew元素翻转

2、transition

元素从一种样式逐渐变为另一种,该属性一般加载鼠标悬浮时的效果,鼠标移出时会逐渐变为原来的样式

第一个参数transition-property表示css属性的名称

第二个参数transition-duration表示过渡效果需要的时间

第三个参数transition-timing-function表示效果的速度曲线

第四个参数transition-delay表示过渡效果开始的时间

它时animation的简化版本,只能设置两帧即开始和结尾

3、animation

创建动画效果,从一个状态变为另一个状态,只有css属性值为数字值时才可以创建动画效果

animation(styles,option)

styles:表示产生动画效果的css样式,css样式要使用驼峰式(如font-size要用fontSize),option表示动画的额外效果

option包含的值

speed:动画的值

easing:

转载于:https://www.cnblogs.com/lhyhappy365/p/9182865.html

你可能感兴趣的文章
[转载] 致命伴侣
查看>>
HTML5 localStorage本地存储实际应用举例
查看>>
Scala访问修饰符
查看>>
实习感悟
查看>>
产品经理网站小结
查看>>
Bootstrap 附加导航插件
查看>>
如何设置启动SMTP、POP3以及IMAP4的SSL服务端口?
查看>>
自制函数strcpy
查看>>
gSoap开发(三)——WSDL简介
查看>>
软件RAID5项目实战!!!
查看>>
Java基础学习总结(21)——数组
查看>>
js格式化日期
查看>>
定时与延时任务
查看>>
Squid 日志分析 和反向代理
查看>>
Hadoop的安装及一些基本概念解释
查看>>
大容量分区命令parted
查看>>
从输入 URL 到页面加载完成的过程中都发生了什么事情?
查看>>
实例讲解JQuery中this和$(this)区别
查看>>
centos 7 静态ip地址模板
查看>>
影响系统性能的20个瓶颈
查看>>