English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
CSS动画-delay属性定义了动画何时开始播放（例如：值为2s，表示动画将在应用后2从0秒开始播放）。 此属性的值可以以秒（s）或毫秒（ms）为单位指定。
下表总结了此属性的用法上下文和版本历史记录。
| 默认值： | 0s |
|---|---|
| 适用于： | 所有元素::before和::after Pseudo-Element |
| Vererbung: | Keine |
| Animierbar: | Nein.Siehe auch Animationseigenschaft. |
| Version: | CSS3neue Funktion |
| JavaScript-Syntax: | object object.style.animationDelay="2s" |
Die Syntax dieses Attributes ist wie folgt:
animation-delay: time | initial | inherit
Der folgende Beispiel zeigt, wie man animation verwendet-delay-Eigenschaft.
.box {
width: 50px;
height: 50px;
background: red;
position: relative;
/* Chrome, Safari, Opera */
-webkit-animation-name: moveit;
-webkit-animation-duration: 4s;
-webkit-animation-delay: 2s;
animation-name: moveit;
animation-duration: 4s;
animation-delay: 2s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes moveit {
from {left: 0;}
to {left: 50%;}
}
@keyframes moveit {
from {left: 0;}
to {left: 50%;}
}Testen Sie es heraus‹/›Hinweis:Diese Eigenschaft ermöglicht den Einsatz von negativen Werten. Es scheint jedoch, dass sie bereits in der Mitte des Animationscycles beginnt, z.B.-2Die animation delay von s beginnt sofort, aber führt die Animation im Verlauf des Animationscycles fort, z.B.2Startet nach einer Sekunde.
Die folgende Tabelle beschreibt die Werte dieser Eigenschaft.
| Wert | Beschreibung |
|---|---|
| time | Definiert die Anzahl der Sekunden oder Millisekunden, die vor dem Start der Animation gewartet wird. Der Standardwert ist 0s. |
| initial | Setzen Sie diesen Wert auf seinen Standardwert. |
| inherit | Wenn angegeben, verwendet der verknüpfte Element seine animation des Elternelements.-Berechneter Wert der delay-Eigenschaft. |
animation-Kompatibilität der delay-Eigenschaft mit Browsern, alle gängigen Browser unterstützen diese Eigenschaft.
|
Bitte beziehen Sie sich auf die folgenden Anleitungen:CSS3Animation.
Verwandte Eigenschaften und Regeln:animation,animation-name,animation-duration,animation-timing-function,animation-iteration-count,animation-direction,animation-fill-mode,animation-play-state,@keyframes.