transition-property
transition-property 指定应用过渡属性的名称。
uni-app x 兼容性
| Web | Android | iOS | HarmonyOS |
| 4.0 | 3.9 | 4.11 | 4.61 |
语法
示例源码如下,请查看 pre > code 标签中的内容
transition-property: none | <single-transition-property>#;
值限制
transition-property 的属性值
| 名称 | 兼容性 | 描述 |
| all | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 4.13 | 4.13 | 4.61 |
| 所有可被动画的属性都表现出过渡动画。 |
| none | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 4.13 | 4.13 | 4.61 |
| 没有过渡动画。 |
| width | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制宽度属性的过渡效果 |
| height | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制高度属性的过渡效果 |
| margin | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制外边距属性的过渡效果 |
| margin-top | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制上外边距属性的过渡效果 |
| margin-bottom | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制下外边距属性的过渡效果 |
| margin-left | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制左外边距属性的过渡效果 |
| margin-right | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制右外边距属性的过渡效果 |
| left | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制左侧位置属性的过渡效果 |
| right | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制右侧位置属性的过渡效果 |
| top | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制顶部位置属性的过渡效果 |
| bottom | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制底部位置属性的过渡效果 |
| padding | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制内边距属性的过渡效果 |
| padding-left | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制左内边距属性的过渡效果 |
| padding-right | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制右内边距属性的过渡效果 |
| padding-top | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制上内边距属性的过渡效果 |
| padding-bottom | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制下内边距属性的过渡效果 |
| opacity | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制透明度属性的过渡效果 |
| background-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制背景颜色属性的过渡效果 |
| border-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制边框颜色属性的过渡效果 |
| border-top-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制上边框颜色属性的过渡效果 |
| border-bottom-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制下边框颜色属性的过渡效果 |
| border-left-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制左边框颜色属性的过渡效果 |
| border-right-color | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制右边框颜色属性的过渡效果 |
| transform | |
Web
|
Android
|
iOS
|
HarmonyOS
| | 4.0 | 3.9 | 4.11 | 4.61 |
| 控制变换属性的过渡效果 |
App平台
从 HBuilderX4.11 版起,默认值调整为all。HBuilderX4.11 以下版本,默认值为none。
默认值
| 平台 | 默认值 |
| uvue-app | all |
| uvue-web | all |
注意:W3C 默认值为:all
参见