笔记：css控制背景图片呼吸样式、闪烁样式

<div id="ovalDiv" class="ovalDiv"></div>

.ovalDiv {
  width: 990px;
  height: 990px;
  background-image: url("~@/assets/img/bigScreen/oval.png");
  background-size: 990px 990px;
  position: absolute;
  top: 0;
  left: 1110px;
  animation-name: ovalDiv;                  /*应用动画  值为div绑定的id*/
  animation-duration: 3s;                 /*设置动画持续时间*/
  animation-iteration-count: infinite;    /*使动画循环*/
  animation-timing-function: linear;      /*使动画的速度曲线为线性增长*/

}

@keyframes ovalDiv { /* 值为div绑定的id */
  0%{
    //transform: scale(0.9); // 呼吸
    opacity: 1; // 闪烁
  }
  50%{
    //transform: scale(1.1);
    opacity: 0;
  }
  100%{
    //transform: scale(0.9);
    opacity: 1;
  }
}

animation可简写

animation: name duration timing-function delay iteration-count direction;