daisyUI 사용법

이동원·2024년 7월 23일

daisyUI 를 이용해서 CSS 하기

  • 단위체계는 rem ,px 이다. ex) class="w-4" 는 1rem =16px 인데 , rem에따라 바뀐다. 하지만 고정하고싶으면 w-[20px]로
  • class="bg-blue-600 w-64 h-64 border-8 border-black rounded-2xl" 은 배경색이다 , 넓이 높이설정 ,태두리크기설정 , 태두리검정, 모서리둥굴게
  • class="w-64 h-64 bg-pink-400 p-4 m-4 mx-10 my-10" 패딩(내부)을 1rem만큼 마진(외부)도 1rem만큼 , x축 y축만 적용
  • class="w-64 h-64 bg-black text-pink-400 text-2xl font-bold cursor-pointer" 폰트 색 ,폰트사이즈, 폰트굵기 , 마우스 모양 커서로 바뀜
  • class="w-64 h-64 bg-pink-400 text-black text-[50px] flex justify-center items-center" x축에대한 가운데 정렬 , y축에대한가운데 정렬
  • class="h-[750px] bg-black flex flex col" 컬럼방향.
  • class="hover:bg-pulple-400, hover:text-pulple-400" 마우스올릴때 색바뀜 배경색 , 마우스올릴때 색바뀜 문
  • grid grid-cols-4 는 Grid 레이아웃의 열을 4개로 나눕니다.

0개의 댓글