本站同款头像呼吸光环教程

效果图

使用方法

通过浏览器的审查元素功能，找到头像的html元素。
若头像元素为avatar，就可以在css中添加

特效呼吸光环css

放入公共css文件里即可

 /*头像呼吸光环*/
    /*橙子博客 WWW.CZDHW.CN*/
    .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;}
    }