animate.css使用

1.vue的使用:1,将animate.css的文件放在assets里面,
2.main.js引入css文件;
import '../src/assets/animate.css'
 
 
3.组件中使用:
<div class="chcolor animated bounce infinite"><span>今天333333:</span>
 
 

 

 

 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
首先引入css文件
    <link rel="stylesheet" href="animate.css">
    <style>
        .rest{
            height: 200px;
            width: 200px;
            background-color: blueviolet;
        }
    </style>
    <title>Document</title>
</head>
<body>
    <div>
        <!-- 在中间添加个infinite就可以循环播放动画。 -->
        <h1 class="animated bounce infinite">你好啊</h1>
    </div>
    <div class="rest animated shake infinite"></div>
    <div class="animated heartBeat infinite"><img src="../图片/05.png" alt=""></div>
    <div class="animated bounceInLeft infinite"><h2 style="chartreuse; width: 20%;">欢迎来到王者荣耀</h2>
    </div>
</body>
</html>
posted @ 2020-04-26 10:32  hongwj  阅读(386)  评论(0编辑  收藏  举报