animate.css 사용법
animate.css는 애니메이션 라이브러리이다.
css를 통해 직접 만들수도 있지만 이를 이용하면 더욱 간편하게 사용가능하다.
공식사이트
Animate.css | A cross-browser library of CSS animations.
Animate.css is a library of ready-to-use, cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and attention-guiding hints.
animate.style
설치방법
npm
$ npm install animate.css --save
cdn
<head>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
</head>
혹은 깃허브에서 다운받아 사용할 수 있다.
https://github.com/animate-css/animate.css
GitHub - animate-css/animate.css: 🍿 A cross-browser library of CSS animations. As easy to use as an easy thing.
🍿 A cross-browser library of CSS animations. As easy to use as an easy thing. - GitHub - animate-css/animate.css: 🍿 A cross-browser library of CSS animations. As easy to use as an easy thing.
github.com
사용방법
<div class="animate__animated animate__pulse">HELLO</div>animate__animated를 기본값으로 넣어준 뒤,
공식홈페이지에 있는 애니메이션 이름을 class에 넣어주면 된다.