当前位置:首页 > 开发 > Web前端 > Html5 > 正文

CSS3+HTML5特效6 - 闪烁的文字

发表于: 2015-11-13   作者:互联网   来源:转载   浏览次数:
摘要: 先看效果 abcd   这个效果也比较简单,利用keyframes对文字的大小、透明度及颜色做循环显示。   CSS 1 <style> 2 @-webkit-keyframes flash { 3 0%{ 4 opacity: 0; 5 } 6 50%{ 7 opa

先看效果

abcd

 

这个效果也比较简单,利用keyframes对文字的大小、透明度及颜色做循环显示。

 

CSS

 1 <style>

 2 @-webkit-keyframes flash {

 3     0%{

 4         opacity: 0;

 5     }

 6     50%{

 7         opacity: 1;

 8         color: #ff0000;

 9         font-size: 18px;

10     }

11     100%{

12         opacity: 0;

13     }

14 }

15 @keyframes flash {

16     0%{

17         opacity: 0;

18     }

19     50%{

20         opacity: 1;

21         color: #ff0000;

22         font-size: 18px;

23     }

24     100%{

25         opacity: 0;

26     }

27 }

28 .flash{

29     position: relative;

30     top: 10px;

31     left: 10px;

32     width: 200px;

33     color: #0000ff;

34     -webkit-animation:flash 1.5s infinite  cubic-bezier(1,0,0.5,0) ;

35     animation:flash 1.5s infinite  cubic-bezier(1,0,0.5,0) ;

36 }

37 </style>

 

HTML

1 <div class="flash">abcd</div>

 

CSS3+HTML5特效6 - 闪烁的文字

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
原文: CSS3+HTML5特效8 - 顶部和右侧固定,左侧随窗口变化的布局 效果演示 实现原理 使用3个div(一
效果演示 实现原理 使用3个div(一个是顶部栏,一个是左侧栏,一个是右侧栏); 使用checkbox作为判
蓝色系雨水下落形成的flash粒子效果,看上去很有动感很炫的flash粒子特效,可以通过xml文件方便的修
[转自]http://68ps.5d6d.com/thread-15253-1-3.html 此种效果步骤较繁锁,绝不适合新手,效果是很好
(function(){ var o = document.getElementById("hutia"); var s = o.innerHTML; var span = docume
一个Jq文字特效插件,包括3D效果。兼容性只有IE9+哈。 引入的库 <script type="text/javascript"
(function(){ var o = document.getElementById("hutia"); var s = o.innerHTML; var span = docume
public Game1() { graphics = new GraphicsDeviceManager(this); Content.RootDirectory = "Content
这个实例的本意展示j2me的字体,和滚屏的实现。我只实现了android自带的三种字体. 下面给出效果图:
这个实例的本意展示j2me的字体,和滚屏的实现。我只实现了android自带的三种字体. 下面给出效果图:
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号