一闪一闪图片 css动画

Html

<div class="flashing-image">
  <img src="path-to-your-image.jpg" alt="Flashing Image">
</div>

CSS:

.flashing-image img {
  width: 100px; /* 设置图片大小 */
  height: 100px; /* 设置图片大小 */
  animation: blink 1s infinite; /* 设置动画 */
}
 
@keyframes blink {
  0% {
    opacity: 1; /* 动画开始时不透明 */
  }
  50% {
    opacity: 0; /* 动画中间时完全透明 */
  }
  100% {
    opacity: 1; /* 动画结束时重新不透明 */
  }
}

这段代码会使得图片不断地闪烁，闪烁的频率由animation属性中的1s决定，即每秒闪烁一次。可以通过调整@keyframes中的百分比来改变闪烁的强度和速度。