英[fɪl ] 美[fɪl]
vt.& vi. (faire) plein, (faire) plein vt pour préparer des médicaments (sur commande); (sentiments) n. pour remplir la quantité de... ;plein; remplir; remblaiTroisième personne du singulier: remplit le pluriel: remplit le participe passé: rempli le participe passé: remplimode
英[məʊd] 美[moʊd] n manière; mode, modepluriel: modes
propriété CSS animation-fill-mode syntaxe
animation-fill-mode Qu'est-ce que cela signifie ?
animation-fill-mode est une propriété d'animation de CSS, qui est utilisée pour spécifier si l'effet d'animation est visible avant ou après la lecture de l'animation.
Fonction : L'attribut animation-fill-mode spécifie si l'effet d'animation est visible avant ou après la lecture de l'animation.
Syntaxe : animation-fill-mode : none | forward | forwards Une fois l'animation terminée, conservez la dernière valeur de propriété (définie dans la dernière image clé). applique en arrière la valeur de la propriété start (définie dans la première image clé) avant que l'animation ne soit affichée pendant une période de temps spécifiée par animation-delay. Les modes de remplissage avant et arrière sont appliqués.
Remarque : Internet Explorer 9 et les versions antérieures ne prennent pas en charge l'attribut animation-fill-mode.
propriété CSS animation-fill-mode exemple
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
div
{
width:100px;
height:100px;
background:red;
position:relative;
animation:mymove 3s;
animation-iteration-count:2;
animation-fill-mode:forwards;
/* Safari 和 Chrome */
-webkit-animation:mymove 3s;
-webkit-animation-iteration-count:2;
-webkit-animation-fill-mode:forwards;
}
@keyframes mymove
{
from {top:0px;}
to {top:200px;}
}
@-webkit-keyframes mymove /* Safari 和 Chrome */
{
from {top:0px;}
to {top:200px;}
}
</style>
</head>
<body>
<p><strong>注意：</strong>Internet Explorer 9 及其之前的版本不支持 animation-fill-mode 属性。</p>
<div></div>
</body>
</html>Exécuter l'instance »
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne