悬停在按钮上,按钮抖动
1 <style> 2 .lanren { 3 margin: 100px auto; 4 width: 200px; 5 text-align: center; 6 height: 40px; 7 line-height: 40px; 8 border: 1px solid #CCC; 9 border-radius: 2px; 10 } 11 .lanren:hover { 12 animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both; 13 } 14 @keyframes shake { 15 10%, 90% { 16 transform: translate3d(-1px, 0, 0); 17 } 18 20%, 80% { 19 transform: translate3d(2px, 0, 0); 20 } 21 30%, 50%, 70% { 22 transform: translate3d(-4px, 0, 0); 23 } 24 40%, 60% { 25 transform: translate3d(4px, 0, 0); 26 } 27 } 28 </style> 29 30 <div class="lanren">你敢悬停在我上面吗?</div>
一辈子很短,努力的做好两件事就好;第一件事是热爱生活,好好的去爱身边的人;第二件事是努力学习,在工作中取得不一样的成绩,实现自己的价值,而不是仅仅为了赚钱;