头像闪烁效果

最新推荐文章于 2021-06-03 03:36:08 发布

krifyFan

最新推荐文章于 2021-06-03 03:36:08 发布

阅读量832

点赞数

分类专栏：日常知识文章标签：头像闪烁 keyframes

本文链接：https://blog.csdn.net/weixin_43452622/article/details/98208070

版权

日常知识专栏收录该内容

39 篇文章 1 订阅

订阅专栏

<div class="head-portrait blingbling">
</div>
<style>
.head-portrait{
	height: 20px;
	width: 20px;
	border-radius: 20px;
	border: 1px solid brown;
}
/*头像闪烁部分*/
@keyframes scaleout{
	0% {
		-webkit-transform: scale(1);
	}
	100% {
		-webkit-transform: scale(1.1);
		opacity: 0;
	}
}
/*此处的scaleout需要与上面定义的名字scaleout 保持一致*/
.blingbling{
	animation: scaleout 1.5s infinite ease-in-out;
}
</style>