transition 简写属性,用于在一个属性中设置四个过渡属性。
transition-property 规定应用过渡的 CSS 属性的名称。
transition-duration 定义过渡效果花费的时间。默认是 0。
transition-timing-function 规定过渡效果的时间曲线。默认是 "ease"。
transition-delay 规定过渡效果何时开始。默认是 0。
~~~
/* Apply to 1 property */
/* property name | duration */
transition: margin-right 4s;
/* property name | duration | delay */
transition: margin-right 4s 1s;
/* property name | duration | timing function */
transition: margin-right 4s ease-in-out;
/* property name | duration | timing function | delay */
transition: margin-right 4s ease-in-out 1s;
/* Apply to 2 properties */
transition: margin-right 4s, color 1s;
/* Apply to all changed properties */
transition: all 0.5s ease-out;
/* Global values */
transition: inherit;
transition: initial;
transition: unset;
~~~
- 1.基本样式
- 0.样式初始化
- 1. 渐变色
- 2. hover问题
- 3. 阴影
- 4. 选择器
- 5. border.画边线
- 6. 水平垂直居中
- 7.input 输入框需要缩进
- 8.文字问题
- 2. 方法
- 1. 定位浮动和flex
- 1. 阮一峰
- 2. position
- 3. flex
- 2. bootstrap 3
- 3. sass语法
- 4.margin-top bug 解决方法
- 5. iconfont图标
- 3. 动画特效
- 特效总结
- 动画
- css2d转换
- 过渡
- 1. 入场从无到有
- 2. 两面切换
- 3. 小三角及原理
- 4. 点击图片单独显示
- 5. 导航条吸顶
- 6. 进度条
- 7. animate效果 jquery
- 8.3D透视旋转
- 4.grid布局
- 1.grid布局 网格居中对齐
- HTML
- 第一节、学习网站
- 第二节、封装
- 第三节、快捷键使用