animation-composition add和accumulate区别实例页面
回到相关文章 »效果：
// zxx:鼠标悬停上面两种图片，观察模糊度区别
代码：
CSS代码：
img:hover {
filter: blur(2px);
animation: 1s pulse both;
}
.img1 {
animation-composition: add;
}
.img2 {
animation-composition: accumulate;
}
@keyframes pulse {
0% {
filter: blur(0px);
}
100% {
filter: blur(2px);
}
}
HTML代码：
<img src="1.jpg" class="img1"> <img src="1.jpg" class="img2">