animation-delay屬性用來(lái)定義動(dòng)畫(huà)開(kāi)始播放的時(shí)間，用來(lái)觸發(fā)動(dòng)畫(huà)播放的時(shí)間點(diǎn)。和transition-delay屬性一樣，用于定義在瀏覽器開(kāi)始執(zhí)行動(dòng)畫(huà)之前等待的時(shí)間。

語(yǔ)法規(guī)則：

案例演示：    

瀏覽器渲染樣式之后2S之后觸發(fā)move動(dòng)畫(huà)。

HTML:

<div><span></span></div>

CSS:

@keyframes move {
  0%{
    transform: translate(0);
  }
  15%{
    transform: translate(100px,180px);
  }
  30%{
    transform: translate(150px,0);
  }
  45%{
    transform: translate(250px,180px);
  }
  60%{
    transform:translate(300px,0);
  }
  75%{
    transform: translate(450px,180px);
  }
  100%{
    transfrom: translate(480px,0);
  }
}
div {
  width: 500px;
  height: 200px;
  border: 1px solid red;
  margin: 20px auto;
}
div span {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: green;
  border-radius: 100%;
  animation-name:move;
  animation-duration: 10s;
  animation-timing-function:ease;
  animation-delay:2s;
  animation-iteration-count:infinite;
}

結(jié)果展示：