利用css3中的animation来模拟input中的光标闪烁动效

需求：实现鼠标点击这个横线的时候，左侧的蓝色条模拟input中的光标闪烁。

结构：

      <span class="wrapper">
            <img src="">
      </span>

动效：

img{
  animation:cursorImg 1s infinite steps(1, start);
          @keyframes cursorImg {
            0%, 100% {
             opacity: 0;
            }
            50% {
             opacity: 1;
            }
          }
}