문제풀이2 재미있게 Grid를 마스터하는 - Grid Garden 1/3 (문제풀이 1~10) 재미있게 Grid를 마스터하는 - Grid Garden 1/3 (문제풀이 1~10) 이전 포스팅에서는 어쩌면 Grid와 짝을 이루는(?) Flex에 대해서 문제풀이를 함께 진행해보았습니다. 얼핏 볼 때는 Grid가 왠지 더 직관적이고 좋아 보이지만, Flex 만으로도 사실 어지간한 UI 구조는 대응이 가능합니다. 재미있게 Flex를 마스터하는 - Flexbox Froggy 1/3재미있게 Flex를 마스터하는 - Flexbox Froggy 1/3 CSS를 공부하다 보면, Flexbox는 꼭 만나게 되는 핵심 기술입니다. 저도 예전에 배웠던 Flex를 다시 복습하며, 라는 게임으로 개념을 익히고 있dcsky.co.kr Flex는 플랙스 특성상 쓰임이 좋은 곳이 있고, 또 Grid는 그리드 대로 .. 2025. 2. 5. 재미있게 Flex를 마스터하는 - Flexbox Froggy 3/3 재미있게 Flex를 마스터하는 - Flexbox Froggy 3/3 이제 Flexbox Froggy 문제풀이 마지막 장입니다. 어떤가요? Flex 속성을 다루는 일이 한층 쉬워졌다는 생각이 들지 않으신가요?자, 그럼 거두절미 하고 마지막 24번 문제까지 함께 또 풀어보도록 합시다! 문제 17: 이 문제는 order와 align-self 속성의 조합을 활용하는 문제입니다. order 속성은 마치 z-index와 비슷하게 작동합니다. order 값으로 어떤 숫자를 사용하든 Flex 아이템의 순서를 조절할 수 있습니다. #pond { display: flex; align-items: flex-start;}.yellow { order: 1; align-self: flex-end;} 문제 18.. 2025. 2. 4. 이전 1 다음
