如何利用animate.css给网页元素添加动画效果？

——温馨提示——

已复制到剪贴板，可粘贴到下一处。

时间：2024-05-02 访问量：1148

编者按：animate.css是一个css3动画库，可以到github上去下载。github 地址：https://github.com/daneden/animate.css，animate.css里面预设了很多种常用的动画。它是把不同的动画绑定到了不同的类里，所以我们想要使用哪种动画的时候，只需要简单的把那个相应的类添加到元素上就行了。首先在head中引入animate.css文件。然后，你想

animate.css是一个css3动画库，演示效果可访问：https://animate.style/。https://www.w3school.com.cn/cssref/pr_animation.asp。可以到github上去下载animate.css。github 地址：https://github.com/animate-css/animate.css，animate.css里面预设了很多种常用的动画。它是把不同的动画绑定到了不同的类里。

首先在head中引入animate.css文件。示范代码如下：<link rel="stylesheet" href="/template/default/css/animate.css">

然后，你想要给哪个元素添加动画效果，就给那个元素添加上animated类以及特定的动画类名，切记：animated是每个要进行动画的元素都必须要添加的类。示范代码如下：

<p class="animated pulse" style="animation-iteration-count: infinite;animate-duration: 6s;">需要添加动画的文字</p>

本文标签：

发表评论：

评论记录：

未查询到任何数据！

上一篇：调整nginx配置文件禁止指定目录下运行.php类型木马文件

下一篇：CSS中如何实现页面元素自动换行（断行），防止过长英文单词等文本元素撑破溢出文本框外？

关于律师

————受人之托，忠人之事————

邓杰律师

专业

专注执业领域事务

尽责

全力办理委托事项

务实

扎实维护合法权益

邓杰，专职律师（律师执业证号：14403201810022100），执业于北京市炜衡（深圳）律师事务所（律所执业证号：24403200511032007）。邓杰律师现（或曾）兼任深圳市人民政府听证员、深圳市政府采购评审专家（法律类）、深圳市某区城建部门公职律师、建设工程定标专家、计算机信息网络安全员、Web前端开发工程师、Web服务器维护工程师，在城建、教育、纪检等政府系统以及网络科技领域从业多年，十分了解行政程序运行规则，颇为熟悉网络领域软件程序，非常擅长互联网+平台（含电子商务、网络游戏、软件程序、数据合规、区块链等）、房地产与建设工程（含工程质量与结算、房屋买卖与租赁、征地拆迁赔偿、小区物业管理等）、民间借贷、劳动争议、婚姻家事、强制执行等领域各类法律实务，可为政府、企业和个人等各类型客户提供全方位、多层次的非诉、诉讼、仲裁、执行等一揽子法律解决方案，能有效维护委托人的各类合法权益。