首页 > 其他分享 >第三方css动画库

第三方css动画库

时间:2024-05-29 18:11:05浏览次数:22  
标签:npm 动画 animate animated 第三方 css

https://animate.style/
//安装

npm install animate.css --save
//引入
import 'animate.css';

//使用
<h1 class="animate__animated animate__bounce">An animated element</h1>
//样式名称 必须加 animate__animated 之后
 


 
 

 

标签:npm,动画,animate,animated,第三方,css
From: https://www.cnblogs.com/7788mmhh/p/17560873.html

相关文章

  • vite配置自动引入全局scss变量文件
    全局自动引入scss变量文件当定义了全局的scss变量文件并且而其他很多页面都需要使用的时候,都需要显式的使用@import或者@use引用一遍全局scss文件,很是麻烦。使用以下配置这样能有效避免造成大量重复工作,可以在任何scss文件中任意使用全局变量。定义全局scss变量文件配置vi......
  • CSS3 超实用属性:pointer-events (可穿透图层的鼠标事件)
    1、是什么pointer-events 直译为指针事件,该属性指定在什么情况下某个DOM可以成为鼠标事件的target。简而言之,就是允许/禁止DOM的鼠标事件(click事件、hover事件、mouse事件等鼠标事件)2、具体属性分析用法分析:pointer-events:auto|none|visiblePainted|visibleFill|......
  • css通过子元素选择父元素的实现示例
    在CSS中,直接通过子元素选择其父元素并不直接支持,因为CSS的选择器是从上到下(从父元素到子元素)进行选择的,而不是相反。但是,你可以使用其他方法或技术来间接实现这一效果,比如使用JavaScript、jQuery或其他脚本语言,或者通过调整你的HTML结构和CSS样式来达到类似的效果。不过,我可以给......
  • Qt 动画类(QPropertyAnimation)
    前言QPropertyAnimation是QT中的一个动画类,用于对目标对象的属性进行动画效果展示。该类继承自QAbstractAnimation类,使用起来非常方便和灵活。一、QPropertyAnimation类介绍QPropertyAnimation可以对任何QObject的子类的属性进行动画的展示,只要该属性是可写的,即存在set方......
  • css 特殊进度条
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=......
  • css实现按钮文案垂直水平居中,按钮左侧图标相对文字固定距离展示
    需求css实现按钮文案垂直水平居中,按钮左侧图标相对文字固定距离展示,效果如图: 实现方案一:使用margin-right来实现按钮和左侧图标的间距<divclass="download-btn"><divclass="btn-content":class="{'left-icon':showLeftIcon}"><div......
  • css画箭头,三角形
    箭头.arrow{border:solidblack;border-width:01px1px0;display:inline-block;padding:4px;}//向上.up{transform:rotate(-135deg);-webkit-transform:rotate(-135deg);}//向下.down{transform:rotate(45deg);-webkit-transform:r......
  • css中px和em的区别
    px和em是用来表示元素大小的单位,在CSS中经常被使用。px(pixel)是像素单位,表示屏幕上的一个点。它是一个绝对单位,表示一个固定的大小。例如,一个宽度为200px的元素将始终显示为200个像素宽。em是相对单位,根据继承它的父元素的字体大小来计算实际的大小。默认情况下......
  • css04 CSS Combinators
    https://www.w3schools.com/css/css_combinators.aspCSSCombinatorsAcombinatorissomethingthatexplainstherelationshipbetweentheselectors.ACSSselectorcancontainmorethanonesimpleselector.Betweenthesimpleselectors,wecanincludeaco......
  • css05 CSS Pseudo-classes
    https://www.w3schools.com/css/css_pseudo_classes.asp WhatarePseudo-classes?Apseudo-classisusedtodefineaspecialstateofanelement.Forexample,itcanbeusedto:StyleanelementwhenausermousesoveritStylevisitedandunvisitedlinks......