L'attribut animation-delay est utilisé pour définir le moment où l'animation démarre, en secondes ou en millisecondes ; utilisez l'attribut animation-delay pour personnaliser l'effet de retard de l'animation.
Propriété CSS3 animation-delay
Fonction : animation L'attribut -delay définit le moment où l'animation démarre. la valeur du délai d'animation est en secondes ou en millisecondes.
Syntaxe :
animation-delay: time;
temps : peut être omis, la valeur par défaut est 0 utilisée pour définir le temps d'attente avant de démarrer l'animation, en secondes ou ; millisecondes.
Remarque : le temps peut être une valeur négative, -2s provoque le démarrage immédiat de l'animation, mais saute 2 secondes pour entrer dans l'animation.
Remarque : Internet Explorer 9 et les versions antérieures ne prennent pas en charge l'attribut animation-delay.
Exemple d'utilisation de la propriété CSS3 animation-delay
<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:100px;
height:100px;
background:red;
position:relative;
animation:mymove 5s infinite;
animation-delay:2s;
/*Safari and Chrome*/
-webkit-animation:mymove 5s infinite;
-webkit-animation-delay:2s;
}
@keyframes mymove
{
from {left:0px;}
to {left:200px;}
}
@-webkit-keyframes mymove /*Safari and Chrome*/
{
from {left:0px;}
to {left:200px;}
}
</style>
</head>
<body>
<div></div>
</body>
</html>Rendu :
Ce qui précède représente l'intégralité du contenu de cet article, j'espère qu'il sera utile à l'étude de chacun. Pour un contenu plus passionnant, vous pouvez prêter attention aux colonnes de didacticiels pertinentes du site Web PHP chinois ! ! !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
tutoriel CSS3
Quelles sont les propriétés du dégradé CSS3 ?
méthode d'initialisation du tableau c
Que faire si l'image intégrée ne s'affiche pas complètement
Marché ondulation aujourd'hui
Comment ouvrir le format TIF sous Windows
Sur quel échange se trouve Sols Inscription Coin ?
symbole de droit d'auteur HTML
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
