음악, 삶, 개발

나만의 CSS 라이브러리 만들기 : @import 본문

개발 Web/HTML & CSS

나만의 CSS 라이브러리 만들기 : @import

Lee_____ 2020. 12. 15. 20:59

animate.css 나 tailwind css 를 사용하다보니,

아예 나만의 CSS 라이브러리를 만들어보면 어떨까라는 생각을 해보게되었다.

 

먼저 css 파일을 아래와 같이 만들었다.

/* test.css */

.test {

    color               : yellow;
    background-color    : green;

}

이렇게 만든 css 파일을 다른 css 파일 또는 style 태그안에 @import 해주면 된다.

<template>
  
  <div class="test">Hello World!</div>

</template>

<style scoped>

@import './css/test.css';

</style>

이와 같은 방식으로 animate.css 도 만들어졌다.

animate.css 의 소스 폴더