如何在chrome浏览器的css2中添加文本闪烁效果

我在css代码中设置了这个css属性

文本装饰：blink

。不幸的是，它只适用于firefox。一定有办法在Crome中显示闪烁效果。你们必须知道答案。

不幸的是，Chrome不支持此属性的CSS闪烁值。您需要使用jQuery来创建相同的效果。答案就在这里。在本例中，class.blink将使某些东西闪烁。。。你必须写两次东西，因为Chrome需要webkit，而Firefox或Opera不需要

<style>
/**
 * Emulating <blink> using WebKit CSS3 animation        
 *   This code is part of John Smith's blog
 *
 * Copyright 2010 by John Smith, All Rights Reserved
 *
 * @link   http://www.john-smith.me/emulating--lt-blink-gt--using-webkit-css3-animation
 * @date   18th October 2010 at 11:01 p.m.
 * @author John Smith
 */
@-webkit-keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }
        @keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }

.blink {
   text-decoration:blink;

  -webkit-animation-name:blinker;
          animation-name:blinker;  
  -webkit-animation-iteration-count:infinite;  
          animation-iteration-count:infinite;  
  -webkit-animation-timing-function:cubic-bezier(1.0,0,0,1.0);
          animation-timing-function:cubic-bezier(1.0,0,0,1.0);
  -webkit-animation-duration:1s; 
          animation-duration:1s; 
}
</style>

/**
*使用WebKit CSS3动画进行仿真
*此代码是John Smith博客的一部分
*
*约翰·史密斯版权所有，保留所有权利
*
*@linkhttp://www.john-smith.me/emulating--lt-blink-gt--using-webkit-css3-animation
*@日期2010年10月18日晚上11:01。
*@作者约翰·史密斯
*/
@-webkit关键帧闪烁{从{opacity:1.0；}到{opacity:0.0；}}
@关键帧闪烁{从{opacity:1.0；}到{opacity:0.0；}}
.眨眼{
文字装饰：闪烁；
-webkit动画名称：闪烁器；
动画名称：闪烁；
-webkit动画迭代计数：无限；
动画迭代次数：无限；
-webkit动画计时功能：立方贝塞尔（1.0,0,0,1.0）；
动画计时功能：立方贝塞尔（1.0,0,0,1.0）；
-webkit动画持续时间：1s；
动画持续时间：1s；
}

您可以保留（或不保留）旧浏览器的旧闪烁属性（如您所愿）

我只喜欢使用-webkit-（一次），而且我保留了文本装饰，因为Opera和Firefox都知道。（对于其他动画，别无选择。只是为了眨眼，他们已经知道怎么做了）

---

但这只是因为我不喜欢写两遍，而且我很懒。这不是一个建议。

您永远不需要使用jQuery来获得javascript效果。jQuery是一个完整的JavaScript库，这意味着只需几行代码就可以完成，而无需加载整个库。现在，若你们已经在使用jQuery，那个就简单多了。

似乎是个bug，看看这个答案可能重复：虽然你们的结论/陈述/答案完全正确，但我一定不同意你们使用“不幸”这个词。=）不，我坚持我的“不幸”！有时候真的有必要让某些东西眨眼。我知道它可能会被过度使用，但当数据流实时传输到一个web UI，在那里它会被持续监控，可能有必要以这种方式突出显示某些内容。这是它仍然存在的一个原因。标签是一个坏主意，因为它不是语义的，但是当你从不同的网站接收代码并在你的答案中“引用”它时，功能从来没有坏过-自然纯粹出于教育目的-请让以下访问者看到原始作者和版权信息。否则，您可能会给人留下这样的印象，即您的答案中有一部分是您的，因此根据本协议获得许可。我在你的答案中做了一个示范性的编辑，这样现在可以更好地看到这一点。问题的标题说明应该使用CSS2来完成。这是CSS3。