Html 如何在 Css 中制作闪烁的文本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27437229/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make flashing text in Css?
提问by androidnoob
I have an understanding that most web browsers do not support the flashing text animation anymore with the following code: <blink> your text</blink>, however, are there other methods that provide the flashing animation for the text in html or css?
我了解到大多数 Web 浏览器不再支持使用以下代码的闪烁文本动画：<blink> your text</blink>但是，是否还有其他方法可以为 html 或 css 中的文本提供闪烁动画？
回答by SupperSam
Yes! You can use CSS3 animations to handle that now.
是的！您现在可以使用 CSS3 动画来处理它。
HTML:
HTML：
<h1 class="flash">Look at me flash</h1>
CSS:
CSS：
.flash {
animation-name: flash;
animation-duration: 0.2s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-play-state: running;
}
@keyframes flash {
from {color: red;}
to {color: black;}
}
Here's a link to a codepento see it in action.
这是一个代码笔的链接，可以查看它的运行情况。
回答by PavKR
Maybe not as efficient as @SupperSam's answer, but maybe a little bit more cross-browser friendly. You could use JS (jQuery) to achieve the flashing effect by toggling a class.
可能不如@SupperSam 的回答那么有效，但可能对跨浏览器更友好。您可以使用 JS (jQuery) 通过切换类来实现闪烁效果。
eg.
例如。
$(document).ready(function(){
setInterval(function(){
$('.flash').toggleClass('active');
}, 500);
});
See the fiddle here: http://jsfiddle.net/pavkr/8yned9f9/
请参阅此处的小提琴：http: //jsfiddle.net/pavkr/8yned9f9/
