用了WordPress主题有一段时间了,今天对ripro-v2主题进行了一些修改,修改完成后几乎看不出主题被修改了,因为只是添加了一些鼠标悬停样式,今天给大家带来实现鼠标经过用户头像出现呼吸光环并悬停旋转放大的效果。

使用方法:

将以下代码添加到主题的 style.css 里面或者后台的自定义css中:

/*头像呼吸光环和鼠标悬停旋转放大开始ripro-v2可用*/
/*by:主题屋-https://zhutiwu.com/*/
.avatar .rounded-circle{border-radius: 50%; animation: light 4s ease-in-out infinite; transition: 0.5s;}.avatar:hover{transform: scale(1.15) rotate(720deg);}@keyframes light{0%{box-shadow: 0 0 4px #f00;} 25%{box-shadow: 0 0 16px #0f0;} 50%{box-shadow: 0 0 4px #00f;} 75%{box-shadow: 0 0 16px #0f0;} 100%{box-shadow: 0 0 4px #f00;}}
/*by:主题屋-https://zhutiwu.com/*/
/*头像呼吸光环和鼠标悬停旋转放大结束*/

 

发表回复

您的电子邮箱地址不会被公开。