animation.css的使用

关于css动画找到一个很有趣的css库:animation.css;下面是其用法,只需两步即可。
第一步:在html文件中引用该库

    <link rel="stylesheet" href="https://daneden.github.io/animate.css/animate.min.css">

或者直接下载到本地引用

<link rel="stylesheet" href="animate.css">

第二步:实现css动画
实现css动画是利用类名来实现的。

<div class="animated fadeIn">fadeIn</div>
<div class="animated bounce">bounce</div>
<div class="animated bounceOutDown"> bounceOutDown</div>

其中类名:animated 是不可少的,
后面的类名:如:fadeIn等,则是动画的类型。可以在其官网上找到不同类型的动画。(官网:https://daneden.github.io/animate.css/
以上就是animation.css的用法。
浏览器兼容:当然是只兼容支持 CSS3 animate 属性的浏览器,他们分别是:IE10+、Firefox、Chrome、Opera、Safari。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值