如何使图像闪烁？ [英] How do you make an image blink?

问题描述

我想知道如何使图像在CSS中闪烁，如果可能的话。

I was wondering how to make an image blink in CSS, if it is possible. I want to have it blink where it is.

我也想改变速度，但主要是让它闪烁。

I would also like to change the speed but mainly I want to make it blink.

推荐答案

CSS动画救援！

@keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
img {
    animation: blink 1s;
    animation-iteration-count: infinite;
}

http://jsfiddle.net/r6dje/

您可以通过调整时间间隔使其闪烁：

You can make it a sharp blink by adjusting the intervals:

@keyframes blink {
    0% {
        opacity: 1;
    }
    49% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

http://jsfiddle.net/xtJF5/1/

这篇关于如何使图像闪烁？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！