[CSS] Flex와 Tailwind

Flex

프론트앤드 영역이라 잘 접하지 않기 때문에 잊어버리기 쉽다.

사용하려는데 기억이 나지 않을 때, 짧은 시간에 감을 되찾기 위해 다음 문제들을 빠르게 풀어보자.

https://flexboxfroggy.com/#ko

Flexbox Froggy

 

다음은 Flex의 주요 기능들을 보기 좋게 구현해 놓았다. 

https://cdpn.io/pen/debug/adLPwv

CodePen - Flexbox playground

• Properties for the flex container에 해당하는 기능은 부모한테 적용해서 자식들을 한 번에 움직인다.
• Properties for the flex items는 요소 그 자체에 기능을 적용한다.

---

Tailwind

<script src="https://cdn.tailwindcss.com"></script>

 

 

• 테일윈드 치트시트이다. 여기서 사용하려면 css문법을 검색하면 테일윈드로 어떻게 사용하는지 제시해준다.

https://nerdcave.com/tailwind-cheat-sheet

Tailwind CSS Cheat Sheet