网站的头像如何添加呼吸灯、旋转特效？

今天网站冲浪的时候，我看到了很多网站的个人头像居然在发光，鼠标移至上面还可以720度旋转。看起来还是比较好玩的，于是我把代码copy过来了。

只要在你的主题CSS里面加入以下类似的代码即可：

/*头像呼吸灯光环和鼠标悬停旋转*/
.avatar-img .avatar-id-1{
	border-radius: 50%; 
	animation: light 4s ease-in-out infinite;
	transition: 0.5s;
	height: 80px;
	width: 80px;
}
.avatar-img .avatar-id-1:hover{
   transform: scale(1.15) rotate(360deg);
}
@keyframes light{
	0%{
		box-shadow: 0 0 15px #f00;
	} 
	25%{
		box-shadow: 0 0 30px #0f0;
	} 
	50%{
		box-shadow: 0 0 15px #00f;
	} 
	75%{
		box-shadow: 0 0 30px #0f0;
	} 
	100%{
		box-shadow: 0 0 15px #f00;
	}
}

提示：

1. 建议将上述代码放到子主题的“style.css”中。

2. 其中“.avatar-img .avatar-id-1”这串代码表示你头像的类名，需要自行更改（浏览器的调试模式可以查看）。

原作者：阿蛮君，有删改。

下载问题：

1.怎么下载文件？请点击下载帮助。
2.下载地址为什么隐藏了？答：为防止爬虫非法采集，部分内容需登录后下载！
3.无法找到所需书籍或软件或者链接已失效？答：请简化搜索词，若还没有，请在评论区留言。

THE END