tailwindcss는 Utility-First Fundamentals CSS 프레임워크이다. css를 구성하는데 작은 단위의 classname들을 가지고 있어
이것들을 조합해서 웹사이트를 꾸밀 수 있다.
CDN환경에서 간단하게 tailwindcss 사용하기
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<h1 class="text-3xl font-bold underline">
Hello world!
</h1>
</body>
</html>head부분에 "<script src="https://cdn.tailwindcss.com"></script>" 이걸 삽입함으로써 간단하게 tailwindcss를 사용해 볼 수 있다.
tailwindcss관련 사이트
tailwindcss 공식 문서 (어떤 class들이 있는지 확인 가능)
https://tailwindcss.com/docs/installation
Installation: Tailwind CLI - Tailwind CSS
Documentation for the Tailwind CSS framework.
tailwindcss.com
tailwindcss로 만들어진 Components들 모음
https://tailwindui.com/components/
Tailwind UI - Official Tailwind CSS Components & Templates
Beautiful UI components and templates by the creators of Tailwind CSS.
tailwindui.com
또다른 tailwindcss Component 사이트
https://tailwindcomponents.com/
Tailwind CSS Components - 600+ Free Examples and Templates
A free repository of open source Tailwind CSS components and templates to bootstrap your new apps, projects or landing sites!
tailwindcomponents.com
'웹 > CSS' 카테고리의 다른 글
| height: auto 와 height: 100%의 차이 (0) | 2023.07.16 |
|---|
댓글