092024 TIL

오늘은 베이직반에서 테일윈드에 대해서 배웠다 

 

tailwind 란 ? 
쉡게 웹 싸이트를 꾸밀수 있게 도와주는 도구이다 

 

css 파일에 하나하나 스타일을 적었었는데 

 

tailwind 에서는 미리 만드들어진 클래스를 써서 빠르게 스타일을 적용 할 수 있다 

 

반응형 디자인 도 쉽게 적용 할 수 있다 

 

sm; 핸드폰 

md; 태블릿 

lg; 노트북 

 

tailwind 

 

예시 

<div class="bg-blue-500 text-white p-4">
  Hello, Tailwind!
</div>

 

text 는 하얀색 으로만들어 라 

bg blue  백그라운드 파란색으로 바꿔라 

p-4 padding 4만큼 넣어라 

 

 

공식문서에 잘 정리되어서 나와있다 

 

 

설치방법

npx install tailwindcss init 

npm install -D tailwindcss

 

 

 

 

오늘은 베이직반 1회 차 다시 보고 

 

다시 

베이직 반 1회차 투드 리스트 만들었다