4种纯CSS3炫酷文字动画特效

当前位置:主页 > CSS3库 > CSS3动画 > 4种纯CSS3炫酷文字动画特效
4种纯CSS3炫酷文字动画特效
分享:

    插件介绍

    这是一款使用纯CSS3制作的炫酷文字动画特效。该文字动画特效共有4种效果,有波浪文字效果,文字闪动效果等,效果非常酷。

    浏览器兼容性

    浏览器兼容性
    时间:2017-01-19
    阅读:
麦子学院
简要教程

这是一款使用纯CSS3制作的炫酷文字动画特效。该文字动画特效共有4种效果,有波浪文字效果,文字闪动效果等,效果非常酷。

使用方法

在页面中引入style.css、animations.css和animate-complement.css文件。

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/animations.css">
<link rel="stylesheet" href="css/animate-complement.css">
                
HTML结构

该文字动画特效的HTML结构如下,其中style1style4 class类用于控制文字动画的效果:

<div  class="container-exibition-text is-animate text-center style1">
    <div style="animation-delay: 0s;">A</div>
    <div style="animation-delay: 0.1s;">B</div>
    <div style="animation-delay: 0.2s;">C</div>
    <div style="animation-delay: 0.3s;">D</div>
    <div style="animation-delay: 0.4s;">E</div>
    <div style="animation-delay: 0.5s;">F</div>
</div>
                

网友评论