animation动画

.login_box {
   454px;
  // height: 658px;
  background: #ffffff;
  box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.19);
  position: absolute;
  right: 234px;
  top: 14%;
  padding: 40px 50px 50px 50px;
  box-sizing: border-box;
  ///========
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-name: breathe;
  -webkit-animation-duration: 2700ms;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
      // background-image:-webkit-gradient(linear,left top,left bottom,from(#6cc3fe),to(#21a1d0));
}
@-webkit-keyframes breathe {
  0% {
    // opacity: 0.2;
    // box-shadow: 0 1px 2px rgba(255, 255, 255, 0.1);
    // position: relative; /*改成相对定位*/
    box-shadow: 0px 0px 5px 0px #1890ff; /*增加阴影效果*/
    // transition: all 500ms; /*动画过渡*/
  }
  100% {
    // opacity: 1;
    // border: 1px solid rgba(59, 235, 235, 1);
    // box-shadow: 0 1px 30px rgba(59, 255, 255, 1);
    // position: relative; /*改成相对定位*/
    box-shadow: 0px 0px 25px 1px #1890ff; /*增加阴影效果*/
    // transition: all 500ms; /*动画过渡*/
  }
}
原文地址:https://www.cnblogs.com/xiaoxiaoxun/p/14278028.html