- 打卡等级:暂无等级
- 打卡总天数:212
- 打卡月天数:6
- 打卡总奖励:168
- 最近打卡:2025-12-06 17:45:04
|
使用方法
通过浏览器的F12审查元素功能,找到自己头像的html元素。添加下面提供的样式类即可。若头像元素的类为avatar,就可以在css中直接添加。类名你也可以也可以自己随意改。
当然了,你也可以写一个div,添加下面的类。本地也可以实现效果。
悬停头像旋转css
- /*悬停头像旋转*/
- .avatar:hover {
- transform: rotate(666turn);
- transition-delay: 1s;
- transition-property: all;
- transition-duration: 59s;
- transition-timing-function: cubic-bezier(.34,0,.84,1);
- }
复制代码
头像呼吸光环css
- /*头像呼吸光环*/
- .avatar {
- border-radius: 50%;
- animation: light 4s ease-in-out infinite;
- transition: 0.5s;
- }
- @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;}
- }
复制代码
|
|