同步操作将从 OpenHarmony/docs 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
This section describes the dynamic rotation, translation, and scaling effects supported by components. These effects can be set in the style attribute or css files.
Origin coordinates of the transforming object. The values can be numbers (px) or percentages (relative to the target of the animation). If only one value is set, the other value is 50% by default. |
|||
Translation, rotation, and scaling attributes. For details, see Table 1. |
|||
@keyframes rule. For details, see Table 2. |
|||
Delay for playing the animation, in ms or s, for example, 1000 ms or 1s. The default unit is ms. |
|||
Animation duration, in ms or s, for example, 1000 ms or 1s. The default unit is ms. |
|||
Number of times that an animation is played. The animation is played once by default. You can set the value to infinite to play the animation infinitely. |
|||
Speed curve of an animation, which makes the animation more fluent. Available values are as follows:
|
|||
Start and end styles of the animation |
Table 1 Methods of the transform attribute
Changes the size of an element. You need to set the target width and height on the x-axis and y-axis. |
||
Rotates an element. You can set the element to rotate around its x-axis or y-axis. |
||
Table 2 Attributes available for the @keyframes rule
Background color applied to the component after the animation is played. |
|||
Opacity value applied to the component after the animation is played. The value ranges from 0 to 1. The default value is 1. |
|||
Width value applied to the component after the animation is played. |
|||
Height value applied to the component after the animation is played. |
|||
Transformation type applied to a component. For details, see Table 1. |
If there is no default value for when an animation will start or end, use from and to to specify the start and end of the display. The following is an example:
@keyframes Go
{
from {
background-color: #f76160;
transform:translate(100px) rotate(0deg) scale(1.0);
}
to {
background-color: #09ba07;
transform:translate(100px) rotate(180deg) scale(2.0);
}
}
NOTE: The @keyframes rule with from and to defined cannot be dynamically bound to an element.
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。